从原型继承到ES6 class语法

原型

在面向对象的文章中提过的一种设计模式-组合使用构造函数模式和原型模式

function Person(name, age){
    this.name = name
    this.age = age
}
Person.prototype = {
    constructor: Person,
    sayName: function(){
        alert(this.name)
    }
}

构造函数用于定义实例属性，原型模式用于定义方法和共享属性

ES6引入了Calss这个概念，作为对象的模板，通过class关键字，可以定义类

上面的例子可以改写为

class Person {
    constructor(name, age){
        this.name = name
        this.age = age
    }
    //方法中间不需要逗号分割，加了会报错
    sayName(){
        alert(this.name)
    }
}

1. 类的所有方法都定义在类的prototype上
2. 添加新方法可以使用Object.assign方法
3. 类内部的方法是不可枚举的

继承

常用的继承实现方式：

• 属性的获取
  通过call改变作用域

function Male(name, age, sex){
    Person.call(this, name, age)
    this.sex = sex
}

• 方法的获取

  Male.prototype = Object.create(Person.prototype)
  Male.prototype.constructor = Male

我们定义一个函数来实现方法的继承

function inherit(superType, subType){
    var _prototype = Object.create(superType.prototype)
    _prototype.constructor = subType
    subType.prototype = _prototype
}

ES6可以通过extends关键字实现继承

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

class A {}

class B extends A {
  constructor() {
    super();
  }
}
B.__proto__ === A // true
B.prototype.__proto__ === A.prototype // true
B.__proto__.__proto__ === A.__proto__   //true

子类的__proto__属性，表示构造函数的继承，总是指向父类。

子类prototype属性的__proto__属性，表示方法的继承，总是指向父类的prototype属性。

子类实例的__proto__属性的__proto__属性，指向父类实例的__proto__属性。也就是说，子类的原型的原型，是父类的原型。