科技獵基于這篇文章的一些名稱約定：
/*
* 約定
*/
function Fun(){
// 私有屬性
var val = 1; // 私有基本屬性
var arr = [1]; // 私有引用屬性
function fun(){} // 私有函數(shù)（引用屬性）
// 實例屬性
this.val = 1; // 實例基本屬性
this.arr = [1]; // 實例引用屬性
this.fun = function(){}; // 實例函數(shù)（引用屬性）
}
// 原型屬性
Fun.prototype.val = 1; // 原型基本屬性
Fun.prototype.arr = [1]; // 原型引用屬性
Fun.prototype.fun = function(){}; // 原型函數(shù)（引用屬性）
上面的約定應(yīng)該是比較合理的，如果難以理解，可以查看 黯羽輕揚：JS學習筆記2_面向?qū)ο?/a> ，了解更多的基本常識
一.簡單原型鏈
這是實現(xiàn)繼承最簡單的方式了，真的超簡單，核心就一句話（在代碼中用注釋標明了）
1.具體實現(xiàn)
function Super(){
this.val = 1;
this.arr = [1];
}
function Sub(){
// ...
}
Sub.prototype = new Super(); // 核心
var sub1 = new Sub();
var sub2 = new Sub();
sub1.val = 2;
sub1.arr.push(2);
alert(sub1.val); // 2
alert(sub2.val); // 1
alert(sub1.arr); // 1, 2
alert(sub2.arr); // 1, 2
2.核心
拿父類實例來充當子類原型對象
3.優(yōu)缺點
優(yōu)點：
- 簡單，易于實現(xiàn)
缺點：
-
修改sub1.arr后sub2.arr也變了，因為來自原型對象的引用屬性是所有實例共享的。
可以這樣理解：執(zhí)行sub1.arr.push(2);先對sub1進行屬性查找，找遍了實例屬性（在本例中沒有實例屬性），沒找到，就開始順著原型鏈向上找，拿到了sub1的原型對象，一搜身，發(fā)現(xiàn)有arr屬性。于是給arr末尾插入了2，所以sub2.arr也變了
- 創(chuàng)建子類實例時，無法向父類構(gòu)造函數(shù)傳參
二.借用構(gòu)造函數(shù)
簡單原型鏈真夠簡單，可是存在2個致命缺點簡直不能用，于是上個世紀末的jsers就想辦法fix這2個缺陷，然后出現(xiàn)了借用構(gòu)造函數(shù)方式
1.具體實現(xiàn)
function Super(val){
this.val = val;
this.arr = [1];
this.fun = function(){
// ...
}
}
function Sub(val){
Super.call(this, val); // 核心
// ...
}
var sub1 = new Sub(1);
var sub2 = new Sub(2);
sub1.arr.push(2);
alert(sub1.val); // 1
alert(sub2.val); // 2
alert(sub1.arr); // 1, 2
alert(sub2.arr); // 1
alert(sub1.fun === sub2.fun); // false
2.核心
借父類的構(gòu)造函數(shù)來增強子類實例 ，等于是把父類的實例屬性復制了一份給子類實例裝上了（完全沒有用到原型）
3.優(yōu)缺點
優(yōu)點：
- 解決了子類實例共享父類引用屬性的問題
- 創(chuàng)建子類實例時，可以向父類構(gòu)造函數(shù)傳參
P.S.前輩就這么高效，兩個缺陷瞬間修復
缺點：
- 無法實現(xiàn)函數(shù)復用，每個子類實例都持有一個新的fun函數(shù)，太多了就會影響性能，內(nèi)存爆炸。。
P.S.好吧，剛修復了共享引用屬性的問題，又出現(xiàn)了這個新問題。。
三.組合繼承（最常用）
目前我們的借用構(gòu)造函數(shù)方式還是有問題（無法實現(xiàn)函數(shù)復用），沒關(guān)系，接著修復，jsers吭哧吭哧又搞出了組合繼承
1.具體實現(xiàn)
function Super(){
// 只在此處聲明基本屬性和引用屬性
this.val = 1;
this.arr = [1];
}
// 在此處聲明函數(shù)
Super.prototype.fun1 = function(){};
Super.prototype.fun2 = function(){};
//Super.prototype.fun3...
function Sub(){
Super.call(this); // 核心
// ...
}
Sub.prototype = new Super(); // 核心
var sub1 = new Sub(1);
var sub2 = new Sub(2);
alert(sub1.fun === sub2.fun); // true
2.核心
把實例函數(shù)都放在原型對象上，以實現(xiàn)函數(shù)復用。同時還要保留借用構(gòu)造函數(shù)方式的優(yōu)點 ，通過Super.call(this);繼承父類的基本屬性和引用屬性并保留能傳參的優(yōu)點；通過Sub.prototype = new Super();繼承父類函數(shù)，實現(xiàn)函數(shù)復用
3.優(yōu)缺點
優(yōu)點：
- 不存在引用屬性共享問題
- 可傳參
- 函數(shù)可復用
缺點:
- （一點小瑕疵）子類原型上有一份多余的父類實例屬性，因為父類構(gòu)造函數(shù)被調(diào)用了兩次，生成了兩份，而子類實例上的那一份屏蔽了子類原型上的。。。又是內(nèi)存浪費，比剛才情況好點，不過確實是瑕疵
P.S.如果無法理解這個”多余“，可以查看 黯羽輕揚：JS學習筆記2_面向?qū)ο?/a> ，文章末尾有更詳細的解釋
四.寄生組合繼承（最佳方式）
從名字就能看出又是對組合繼承的優(yōu)化，不是說組合繼承有瑕疵嗎，沒關(guān)系，我們接著追求完美
1.具體實現(xiàn)
function beget(obj){ // 生孩子函數(shù) beget：龍beget龍，鳳beget鳳。
var F = function(){};
F.prototype = obj;
return new F();
}
function Super(){
// 只在此處聲明基本屬性和引用屬性
this.val = 1;
this.arr = [1];
}
// 在此處聲明函數(shù)
Super.prototype.fun1 = function(){};
Super.prototype.fun2 = function(){};
//Super.prototype.fun3...
function Sub(){
Super.call(this); // 核心
// ...
}
var proto = beget(Super.prototype); // 核心
proto.constructor = Sub; // 核心
Sub.prototype = proto; // 核心
var sub = new Sub();
alert(sub.val);
alert(sub.arr);
P.S.等等，生孩子函數(shù)是啥東西，怎么沒聽過？還有標明了核心的3句話，怎么沒看明白？別著急，我們喝杯茶接著看
2.核心
用beget(Super.prototype); 切掉了原型對象上多余的那份父類實例屬性
P.S.啥？沒看明白？哦哦~，忘記說原型式和寄生式繼承了，就說怎么總覺得忘了鎖門。。這記性
P.S.寄生組合式繼承，這名字不是很貼切，和寄生式繼承關(guān)系并不是特別大
3.優(yōu)缺點
優(yōu)點：完美了
缺點：理論上沒有了（如果用起來麻煩不算缺點的話。。）
P.S.用起來麻煩是一方面，另一方面是因為寄生組合式繼承出現(xiàn)的比較晚，是21世紀初的東西，大家等不起這么久，所以組合繼承是最常用的，而這個理論上完美的方案卻只是課本上的最佳方式了
五.原型式
其實介紹完上面的完美方案就可以結(jié)束了，但從組合繼承到完美方案好像有一段不小的思維跳躍，有必要把故事說清楚
1.具體實現(xiàn)
function beget(obj){ // 生孩子函數(shù) beget：龍beget龍，鳳beget鳳。
var F = function(){};
F.prototype = obj;
return new F();
}
function Super(){
this.val = 1;
this.arr = [1];
}
// 拿到父類對象
var sup = new Super();
// 生孩子
var sub = beget(sup); // 核心
// 增強
sub.attr1 = 1;
sub.attr2 = 2;
//sub.attr3...
alert(sub.val); // 1
alert(sub.arr); // 1
alert(sub.attr1); // 1
P.S.誒~看到了沒，生孩子函數(shù)beget出現(xiàn)了
2.核心
用生孩子函數(shù)得到 得到一個“純潔”的新對象（“純潔”是因為沒有實例屬性），再逐步增強之（填充實例屬性）
P.S.ES5提供了Object.create()函數(shù)，內(nèi)部就是原型式繼承，IE9+支持
3.優(yōu)缺點
優(yōu)點：
- 從已有對象衍生新對象，不需要創(chuàng)建自定義類型（更像是對象復制，而不是繼承。。）
缺點：
- 原型引用屬性會被所有實例共享，因為是用整個父類對象來充當了子類原型對象，所以這個缺陷無可避免
- 無法實現(xiàn)代碼復用（新對象是現(xiàn)取的，屬性是現(xiàn)添的，都沒用函數(shù)封裝，怎么復用）
P.S.這東西和繼承有很大關(guān)系嗎？為什么尼古拉斯把它也列為實現(xiàn)繼承的一種方式？關(guān)系不大，但有一定關(guān)系
六.寄生式
這名字太扯了，而且 寄生式是一種模式（套路） ，并不是只能用來實現(xiàn)繼承
1.具體實現(xiàn)
function beget(obj){ // 生孩子函數(shù) beget：龍beget龍，鳳beget鳳。
var F = function(){};
F.prototype = obj;
return new F();
}
function Super(){
this.val = 1;
this.arr = [1];
}
function getSubObject(obj){
// 創(chuàng)建新對象
var clone = beget(obj); // 核心
// 增強
clone.attr1 = 1;
clone.attr2 = 2;
//clone.attr3...
return clone;
}
var sub = getSubObject(new Super());
alert(sub.val); // 1
alert(sub.arr); // 1
alert(sub.attr1); // 1
2.核心
給原型式繼承穿了個馬甲而已 ，看起來更像繼承了（上面介紹的原型式繼承更像是對象復制）
注意 ：beget函數(shù)并不是必須的，換言之，創(chuàng)建新對象 -> 增強 -> 返回該對象，這樣的過程叫寄生式繼承，新對象是如何創(chuàng)建的并不重要（用beget生的，new出來的，字面量現(xiàn)做的。。都可以）
3.優(yōu)缺點
優(yōu)點：
- 還是不需要創(chuàng)建自定義類型
缺點：
- 無法實現(xiàn)函數(shù)復用（沒用到原型，當然不行）
P.S.劇情解析：有缺陷的寄生式繼承 + 不完美的組合繼承 = 完美的寄生組合式繼承，不妨 回去找找 看哪里用到了寄生
七.6種繼承方式的聯(lián)系
P.S.虛線表示輔助作用，實線表示決定性作用