前言
学习继承前一定要熟知原型，原型链和this 你会发现所有的继承都逃不出这三个东西
原型链继承
function Parent () {
this.name = 'kevin';
}
Parent.prototype.getName = function () {
console.log(this.name);
}
function Child () {
}
Child.prototype = new Parent();
var child1 = new Child();
console.log(child1.getName()) // kevin
我们知道，创建的实例会通过proto逐个向上寻找属性，所以整个的分析过程就是这样的
问题：
- 引用类型的属性被所有实例共享，举个例子：
function Parent () {
this.names = ['kevin', 'daisy'];
}
function Child () {
}
Child.prototype = new Parent();
var child1 = new Child();
child1.names.push('yayu');
console.log(child1.names); // ["kevin", "daisy", "yayu"]
var child2 = new Child();
console.log(child2.names); // ["kevin", "daisy", "yayu"]
原因吗? 就在下图，有点复杂，简单来说就是， 我们访问的时候，访问的都是Child.prototype上的属性
（因为在 new Parent()的时候，我们执行了Parent函数此时他的this指向Child.prototype，所以相当于在Child.prototype添加了name属性），
例如：child1.name = [] 这种操作，相当于直接在对象child1或者中直接添加了name属性从而覆盖了Child.prototype上的那么属性（其实就是下次访问的时候会直接访问自己身上的name属性），
类似于push这种的却只能通过向下访问的方式改到Child.prototype上的属性，而Child.prototype中的name，em...很不好意思是child1和child2共用的 如图：
构造函数继承 (最经典的继承方式)
function Parent () {
this.names = ['kevin', 'daisy'];
}
function Child () {
Parent.call(this);
}
var child1 = new Child();
child1.names.push('yayu');
console.log(child1.names); // ["kevin", "daisy", "yayu"]
var child2 = new Child();
console.log(child2.names); // ["kevin", "daisy"]
优点：
-
避免了引用类型的属性被所有实例共享
-
可以在 Child 中向 Parent 传参
为什么会有这种有点很简单 ：
child1中的this指向的是Child函数，Parent 函数的this又被指向了Child中的this，此时函数Parent 上的this就是对象child1中的this
这里的name就是相当于在child1中写了一个this.name属性
child2同理 ，所以二者互不干扰，有以上优点
缺点 ： 既然Parent中的this都指向新对象了，那么方法和属性就都需要在构造函数Parent中定义了，并且每次创建实例都会在实例中创建一遍方法或者属性。
组合继承
原型链继承和经典继承双剑合璧。
function Parent (name) {
this.name = name;
this.colors = ['red', 'blue', 'green'];
}
Parent.prototype.getName = function () {
console.log(this.name)
}
function Child (name, age) {
Parent.call(this, name);
this.age = age;
}
Child.prototype = new Parent();
Child.prototype.constructor = Child;
var child1 = new Child('kevin', '18');
child1.colors.push('black');
console.log(child1.name); // kevin
console.log(child1.age); // 18
console.log(child1.colors); // ["red", "blue", "green", "black"]
var child2 = new Child('daisy', '20');
console.log(child2.name); // daisy
console.log(child2.age); // 20
console.log(child2.colors); // ["red", "blue", "green"]
我们知道了构造函数继承访问的属性是自身的属性，要想能访问到父类上的属性
我们只需要让child1能够访问到Parent.prototype的属性，所以借助原型链 Child.prototype = new Parent(); 就解决了这种问题
相当于要是访问name属性，先从child1本身找找不到在找Child.prototype上的属性。
原型试继承
function createObj(o) {
function F(){}
F.prototype = o;
return new F();
}
就是 ES5 Object.create 的模拟实现，将传入的对象作为创建的对象的原型。
缺点：
包含引用类型的属性值始终都会共享相应的值，这点跟原型链继承一样。
寄生式继承
创建一个仅用于封装继承过程的函数，该函数在内部以某种形式来做增强对象，最后返回对象。
function createObj (o) {
var clone = Object.create(o);
clone.sayName = function () {
console.log('hi');
}
return clone;
}
缺点：跟借用构造函数模式一样，每次创建对象都会创建一遍方法。
寄生组合式继承
结合组合式继承来看，我们很轻清楚的知道
在: Child.prototype = new Parent() 和 Parent.call(this, name)
的时候Parent函数被执行了两次，在这两次执行中我们使得Child.prototype和 child1 都有了父类的属性
那么我们该如何精益求精，避免这一次重复调用呢？
如果我们不使用 Child.prototype = new Parent() ，而是间接的让 Child.prototype 访问到 Parent.prototype 呢？
function Parent (name) {
this.name = name;
this.colors = ['red', 'blue', 'green'];
}
Parent.prototype.getName = function () {
console.log(this.name)
}
function Child (name, age) {
Parent.call(this, name);
this.age = age;
}
// 关键的三步
var F = function () {};
F.prototype = Parent.prototype;
Child.prototype = new F();
var child1 = new Child('kevin', '18');
console.log(child1);
这种方式的高效率体现它只调用了一次 Parent 构造函数，并且因此避免了在 Parent.prototype 上面创建不必要的、多余的属性。与此同时，原型链还能保持不变。
总结
还是那句话任何继承离不开原型和原型链和this
