【JavaScript】js中的原型继承

---

1. 理解继承

继承是面向对象编程的三大特性之一(封装、继承、多态)。

多个类中存在相同的属性和行为，将这些内容抽取到单独一个类中，那么多个类无需再定义这些属性和行为，只需要继承那个类即可。
多个类可以称为子类，单独的这个类称为父类或者超类，基类等。 子类可以直接访问父类中的非私有的属性和行为。

以人类为例，地球人都是一个脑袋，双手双脚，很多基本特征都是一样的。
但人类也有细分种类：黄种人、白种人、黑种人。
我们要定义三种人，在共同特征的基础上区别皮肤颜色即可。

如果用代码封装，咱们就可以将人类定义为基类或者超类，拥有脑袋、手、足等属性，说话、走路等行为。黄种人、白种人、黑种人为子类，自动复制父类的属性和行为到自身，然后在此基础上新增或者重写某些属性和行为，例如黄种人拥有黄皮肤、黑头发。这就是继承的思想。

---

2. js中的继承(原型继承)

在其他面向类语言中，继承意味着复制操作，子类是实实在在地将父类的属性和方法复制了过来。

但javascript中的继承不是这样的。根据原型的特性，js中继承的本质是一种委托机制，对象可以将需要的属性和方法委托给原型，需要用的时候就去原型上拿，这样多个对象就可以共享一个原型上的属性和方法，这个过程中是没有复制操作的。

javascript中的继承主要还是依靠于原型链，原型处于原型链中时即可以是某个对象的原型也可以是另一个原型的实例，这样就能形成原型之间的继承关系。

---

3. js6种继承方式

3.1 原型链继承

直接利用原型链特征实现的继承：子类构造函数的prototype指向父类构造函数的实例。

function Person() {
   
    this.head = 1;
    this.hand = 2;
}

function YellowRace() {
   

}

// 实现继承
YellowRace.prototype = new Person();

const hjy = new YellowRace();

console.log(hjy.head); // 1
console.log(hjy.hand); // 2

根据原型链的特性，当我们查找hjy实例的head和hand属性时，由于hjy本身并没有这两个属性，引擎就会去查找hjy的原型，还是没有，继续查找hjy原型的原型，也就是Person原型对象，结果就找到了。就这样，YellowRace和Person之间通过原型链实现了继承关系。

问题：

1. 创建子类的时候，不能给父类的构造函数传递参数。
2. 当原型上的属性是引用数据类型时，所有实例都会共享这个属性，即某个实例对这个属性重写会影响其他实例。

function Person() {
   
    this.colors = ['white','yellow','black'];
}

function YellowRace() {
   

}

// 实现继承
YellowRace.prototype = new Person();

const hjy = new YellowRace();
hjy.colors.push('green');
// ['white', 'yellow', 'black', 'green']
console.log(hjy.colors) 


const laowang = new YellowRace();
// ['white', 'yellow', 'black', 'green']
console.log(laowang.colors) 

可以看到，hjy只是想给自己的生活增添一点绿色，但是却被laowang给享受到了，这肯定不是我们想看到的结果。

为了解决不能传参以及引用类型属性共享的问题，一种叫盗用构造函数的实现继承的技术应运而生。

---

3.2 盗用构造函数

盗用构造函数也叫作“对象伪装”或者“经典继承”，原理就是通过在子类中调用父类构造函数实现上下文的绑定。

function Person(eyes){
   
    this.eyes = eyes;
    this.color = ['white','yellow','black'];
}

function YellowRace(){
   
    Person.call(this,'b