ES6的Class的prototype、__proto__

ES6继承与ES5的区别

ES6通过class实现继承，class的继承通过关键字extends实现。

class Parent{
    constructor(name) {
      this.name = name
    }
    getName() {
      console.log(this.name)
    }
  }
  class Child extends Parent {}
  const child = new Child('zhangsan')
  child.getName()          // zhangsan

如果子类中没有定义constructor()方法，这个方法会默认添加，并且里面会调用super()。
如果子类中定义了constructor()方法，那么构造函数中必须调用super()，这一步会生成继承父类的this对象。

ES5 的继承机制，是先创造一个独立的子类的实例对象，然后再将父类的方法添加到这个对象上面，即“实例在前，继承在后”。ES6 的继承机制，则是先将父类的属性和方法，加到一个空的对象上面，然后再将该对象作为子类的实例，即“继承在前，实例在后”。

ES6中，Class 作为构造函数的语法糖，同时有prototype属性和__proto__属性，因此同时存在两条继承链。

1. 子类的__proto__属性，表示构造函数的继承，总是指向父类
2. 子类prototype的__proto__属性表示方法继承，指向父类的prototype

class A {
}

class B extends A {
}

B.__proto__ === A // true
B.prototype.__proto__ === A.prototype // true

类的继承是按照下面模式

// B 的实例继承 A 的实例
Object.setPrototypeOf(B.prototype, A.prototype);

// B 继承 A 的静态属性
Object.setPrototypeOf(B, A);

Object.setPrototypeOf的实现方式

Object.setPrototypeOf = function (obj, proto) {
  obj.__proto__ = proto;
  return obj;
}

这两条继承链，可以这样理解：

1. 作为一个对象，子类（B）的原型（__proto__属性）是父类（A）
2. 作为一个构造函数，子类（B）的原型对象（prototype属性）是父类的原型对象（prototype属性）的实例。

B.prototype = Object.create(A.prototype);
// 等同于
B.prototype.__proto__ = A.prototype;