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