ECMAScript6 入门 Class 的基本语法与继承

Class语法

1：类的定义
class Point {
  m; //也可以定义在顶部    
  constructor(x, y) {
    //定义类的属性可以在  constructor 函数当中使用this
    this.x = x;
    this.y = y;
  }

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

注意：定义类的方法的时候，前面不需要加function关键字，方法之间也不需要加逗号分隔

2：类的数据类型是函数，类本身指向构造函数
使用的时候，也是直接对类使用new命令，类的所有方法都定义在类的prototype属性上面

3：一次性添加多个方法
class Point {
  constructor(){
    // ...
  }
}

Object.assign(Point.prototype, {
  toString(){},
  toValue(){}
});

注意：类的内部定义的方法，都是不可枚举的

4：取值函数（getter）和存值函数（setter）
在“类”的内部可以使用get和set关键字，对某个属性设置存值函数和取值函数，拦截该属性的存取行为
class MyClass {
  constructor() {
    // ...
  }
  get prop() {
    return 'getter';
  }
  set prop(value) {
    console.log('setter: '+value);
  }
}

let inst = new MyClass();

inst.prop = 123;
// setter: 123

inst.prop
// 'getter'

5：类的属性名可以采用表达式
let methodName = 'getArea';

class Square {
  constructor(length) {
    // ...
  }

  [methodName]() {
    // ...
  }
}

6：类也可以采用表达式的形式定义
const MyClass = class Me {
  getClassName() {
    return Me.name;
  }
};

注意：需要注意的是，这个类的名字是Me，但是Me只在 Class 的内部可用，指代当前类。在 Class 外部，这个类只能用MyClass引用

7：注意点
{
    1：类的内部默认使用严格模式
    2：类不存在变量提升
    3：ES6的类只是ES5的构造函数的包装，所以函数的许多特性都会被继承，包括name属性
    4：如果某个方法之前加上星号（*），就表示该方法是一个 Generator 函数
    5：类的方法内部如果含有this，它默认指向类的实例
}

8：静态方法
类相当于实例的原型，所有在类中定义的方法，都会被实例继承。
如果在一个方法前，加上static关键字，就表示该方法不会被实例继承，
而是直接通过类来调用，这就称为“静态方法”。

静态方法当中的this指向类，而不是实例

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

Foo.classMethod() // 'hello'

var foo = new Foo();
foo.classMethod()
// TypeError: foo.classMethod is not a function

9：静态属性
class Foo {
}

Foo.prop = 1;
Foo.prop // 1

这个属性实例不会继承
目前，只有 这种写法可行，因为 ES6 明确规定，Class 内部只有静态方法，没有静态属性

提案：写法是在实例属性的前面，加上static关键字

10：私有方法和属性
待续...

 

Class的继承

1：子类可以通过extends关键字实现继承

2：子类必须在constructor方法中调用super方法，否则新建实例时会报错 
//如果子类显示定义了constructor，那么第一行必须是调用super方法，继承父类的实例

3：继承的区别
ES5 的继承，实质是先创造子类的实例对象this，然后再将父类的方法添加到this上面（Parent.apply(this)）。
ES6 的继承机制完全不同，实质是先将父类实例对象的属性和方法，加到this上面（所以必须先调用super方法），
然后再用子类的构造函数修改this。

4：Object.getPrototypeOf()
功能：用来从子类上获取父类
因此，也可以通过这个方法判断，一个类是否继承另一个类

5：super
{
    1：作为函数时，只能在子类的构造函数当中使用，且必须执行一次
    2：作为对象时，在普通方法中，指向父类的原型对象，在静态方法中，指向父类
}