ES6 - Class

2019-01-24 本文已影响0人恒星的背影

Class 提供一种更接近其它面向对象语言的写法。

定义一个 Class：

class Point {
  constructor(x, y) {
    this.x = x;
    this.y = y;
  }

  toString() {
    return '(' + this.x + ', ' + this.y + ')';
  }
}

生成对象：

const p = new Point(1, 2)

未使用 static 声明的属性挂在构造函数的 prototype 上。

重要性质：

typeof Point    "function"
Point === Point.prototype.constructor    true
new Point()

这些性质表明 class 就是构造函数。

类必须使用new调用，否则会报错。这是它跟普通构造函数的一个主要区别。

class 表达式：

const MyClass = class Me {
  getClassName() {
    return Me.name;
  }
};

这个类的名字是 MyClass 而不是 Me，Me只在 Class 的内部代码可用，指代当前类。

类不存在变量提升：

new Foo();    // ReferenceError
class Foo {}

通过 new 调用一个函数时，如果函数中 return 非对象类型，则 return 不起作用；如果 return 对象类型，则返回值即是这个对象，这个对象不是构造函数的实例。

在 class 的内部可以使用 get 和 set 关键字，对某个属性设置存值函数和取值函数，拦截该属性的存取行为：

class MyClass {
  constructor() { }
  get prop() {
    return 'getter';
  }
  set prop(value) {
    console.log('setter: '+value);
  }
}

静态方法对应直接挂在构造函数对象上的方法。

代码示例：

class Foo {
  static classMethod() {
    return 'hello';
  }
}

静态方法中的 this 指向构造函数。
父类的静态方法可以被子类继承。
子类中的 super 指向父类。

实例属性除了定义在 constructor() 方法里面的 this 上面，也可以定义在类的最顶层。(此语法暂不支持)

class IncreasingCounter {
  _count = 0;
}

ES6 规定，Class 内部只有静态方法，没有静态属性。

静态属性只能这么写：

class Foo { }
Foo.prop = 1;

暂略