class初探

我们说类的时候,先回忆一下es5的构造函数

  function myobj(x,y){
        this.x= x;
        this.y =y;
    }

    myobj.prototype.add = function(){
        return this.x+this.y
    }

    var num = new myobj(10,5);

    console.log(num.add()); //15

这是构造函数的写法,到了es6出现clss类的写法。下面代码等价于上面的代码

class muobj{
        constructor(x,y){
            this.x = x;
            this.y = y;
        }
        add(){
            return this.x+this.y
        }
    }

    var numb = new myobj(10,5);

    console.log(numb.add()); //15

在上面的代码中我们可以看到出现了关键字class,它可以和对象模板定义一个类。

可以在上面我们看到了一个 constructor 它是es6的构造方法,而this指向实例的对象。

constructor方法是类的默认方法,通过new命令生成对象实例时,自动调用该方法。一个类必须有constructor方法,如果没有显式定义,一个空的constructor方法会被默认添加。

也就是说es6的构造方法对应es5构造函数

class定义的类,里的方法都是直接定义在原型上的。

   class b{
        s(){}
        d(){}
    }

    // 等价于
    function b(){}
    b.prototype = {
        s(){},
        d(){}
    }

而且class定义的类都是是不能枚举的。

属性表达式的写法

let myname = "getdata";

    class stk {
        constructor(x){
            this.x =x;
        }
        [myname](){
            return this.x
        }
    }

    var stkn = new stk("好");
    console.log(stkn.getdata());  //

上面我们定义一个变量,并且赋值“getdata”,在书写类的时候使用 [myname] 表达式。

我们使用的时候,使用的是getdata,并不是myname了。

class表达式的写法

 //class 表达式
    const myc = class me{
        constructor(x){
            this.x =x
        }
    }

    let hu = new myc('李四');
    console.log(hu.x);   //李四

采用 Class 表达式,可以写出立即执行的 Class。

name属性

name属性用于获得class类名

class Point {}
Point.name // "Point"

Generator 方法

如果某个方法之前加上星号(*),就表示该方法是一个 Generator 函数。

class Foo {
  constructor(...args) {
    this.args = args;
  }
  * [Symbol.iterator]() {
    for (let arg of this.args) {
      yield arg;
    }
  }
}

for (let x of new Foo('hello', 'world')) {
  console.log(x);
}
// hello
// world

this指向问题

在使用的过程中可能会存出现  TypeError: Cannot read property 'XXXX' of undefined

很可能是this的指向问题。

建议的写法就是使用箭头函数

先暂停一下。我去回头补上

原文地址:https://es6.ruanyifeng.com/#docs/class

原文地址:https://www.cnblogs.com/chenyudi/p/12857936.html