ECMAScript继承机制实现

快手学习备考

1. 对象冒充（弊端：只能继承父类构造函数的属性，没有继承父类原型的属性；无法复用构造函数；每个新实例都有父类构造函数的副本）

function classA(color) {
    this.color = color;
    this.sayColor = function() {
        console.log(this.color);
    }
}
function classB() {
    this.newMethod = classA;
    this.newMethod();
    delete this.newMethod;
}
// call实现
function classB() {
    classA.call(this, color1, color2);
}
// apply实现
function classB() {
    classA.call(this, arguments);
}

1. 原型链 （弊端：无法向父类的构造函数传参，无法多重继承，继承单一）

function classA() {}
classA.prototype.color = 'red';
classA.prototype.sayColor = function() {
    console.log(this.color);
}
function classB() {}
classB.prototype = new ClassA();

1. 混合方式 （弊端：存在两份相同的父类实例的属性和方法，造成性能上的浪费）

function classA() {
    this.color = 'red';
}
classA.prototype.sayColor = function() {
    console.log(this.color);
}
function classB() {
    classA.call(this, color);
}
classB.prototype = new classA();
classB.prototype.constructor = classB;

1. 寄生组合继承

function classA() {
    this.color = 'red';
}
classA.prototype.sayColor = function() {
    console.log(this.color);
}
function classB() {
    classA.call(this);
}
classB.prototype = Object.create(classA.prototype);
classB.prototype.constructor = classB;

注释：

1. 创建类的最好方式是用构造函数定义属性，用原型定义方法
2. call apply         
是为对象冒充而实现的方法，apply第二个参数是参数数组
3. new 实现了什么
创建一个空对象
将空对象的原型指向构造函数的原型
修改this指向
判断返回值(是对象时，调用return new无效，否则返回obj)
```
function new(con, arguments) {
    let obj = {};
    obj.setPrototypeOf(obj, con.prototype);
    let res = con.apply(obj, arguments);
    return res instanceof Ojbect ? res : obj;
}
```
4. es6的class源码实现
    es5的继承是子类拥有自身的实例对象this，通过call或apply将父类的属性或方法挂载在上面，es6的继承机制则不同，先将父类的属性和方法放在this上面，然后再调用子类的构造函数修改this；
5. object.create()
```
function create(obj) {
    function F() {}
    F.prototype = obj;
    return new F();
}
```
跟普通创建对象方式相比：
创建方式不同（继承） 创建对象属性的性质不同(object.defineProperty) 创建空对象时不同（无原型属性，即无__proto__）
6. 混合继承  object.assign  

3参考链接：https://zhuanlan.zhihu.com/p/158640941
5参考链接：https://www.jianshu.com/p/28d85bebe599
6参考链接：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/create

参考链接：https://www.w3school.com.cn/js/pro_js_inheritance_implementing.asp
https://zhuanlan.zhihu.com/p/110175302