Javascript編程之繼承實(shí)例匯總

更新時(shí)間：2015年11月28日 11:11:18 作者：陳在真Sunny_chen

這篇文章主要介紹了Javascript編程之繼承實(shí)現(xiàn)方法,結(jié)合實(shí)例形式分析匯總了五種常見(jiàn)的繼承技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下

本文實(shí)例講述了Javascript編程之繼承。分享給大家供大家參考，具體如下：

這篇文字是在看完《Javascript 王者歸來(lái)》后的整理總結(jié)，文章詳細(xì)章節(jié)在第21章 P537

繼承一般要實(shí)現(xiàn)以下三層含義：

1）子類(lèi)實(shí)例可以共享父類(lèi)的方法；
2）子類(lèi)可以覆蓋父類(lèi)的方法或者擴(kuò)展新的方法；
3）子類(lèi)和父類(lèi)都是子類(lèi)實(shí)例的類(lèi)型。

一、構(gòu)造繼承法

子類(lèi)中調(diào)用父類(lèi)的構(gòu)造函數(shù)來(lái)維護(hù)的，該繼承法能實(shí)現(xiàn)多重繼承，但只能繼承父類(lèi)的共有方法，無(wú)法繼承靜態(tài)方法，而且不能用instanceof來(lái)驗(yàn)證實(shí)例。

function a(){
  this.say=function(){
  alert("happy new year！");
  }
}
function b(){
  a.apply(this,arguments);
}
a.prototype.fuck=function(){
  alert("%^&%^&%&^%&");
}
var oB=new b();
alert(oB instanceof a);// false
oB.say();       // happy new year
oB.fuck();       // 讀不到

二、原型繼承法／經(jīng)典繼承法

該繼承法是通過(guò)復(fù)制已經(jīng)存在的原型對(duì)象來(lái)實(shí)現(xiàn)行為重用，讓對(duì)象實(shí)例共享原型對(duì)象的屬性。支持多重繼承，繼承原型靜態(tài)方法，能用instanceof來(lái)驗(yàn)證實(shí)例。

function a(){
 this.say=function(){
 alert("happy new year！");
 }
}
function b(){}
a.prototype.fuck=function(){
  alert("%^&%^&%&^%&");
}
a.prototype.z=123;
b.prototype=new a();
var oB=new b();
alert(oB instanceof a); // true
alert(oB.z);      // 123
oB.say();        // happy new year
oB.fuck();       // %^&%^&%&^%&

三、實(shí)例繼承法／寄生構(gòu)造函數(shù)模式

構(gòu)造法不能繼承類(lèi)型的靜態(tài)方法，原型繼承得不完善（某些核心對(duì)象的不可枚舉方法不能繼承），而實(shí)例繼承法能對(duì)原生核心對(duì)象或者DOM對(duì)象進(jìn)行繼承，它通過(guò)在類(lèi)型中構(gòu)造對(duì)象并返回的辦法來(lái)實(shí)現(xiàn)繼承，因此instanceof驗(yàn)證會(huì)是false，不支持多重繼承。

function a(){
 var oA=new Array();
 oA.say=function(){
   alert("hello A!");
 }
 return oA;
}
var obj=new a();
alert(obj instanceof a); // false
obj.say();

四、拷貝繼承法

該方法通過(guò)拷貝基類(lèi)對(duì)象的所有可枚舉屬性和方法來(lái)模擬繼承，因此它可以模擬多繼承，但不能枚舉的就無(wú)法繼承；它可以繼承父類(lèi)的靜態(tài)方法；

function a(){
  this.num=123;
  this.say=function(){
  alert("happy new year！");
  }
}
function b(){
  this.extends=function(obj){
    for(each in obj){
      this[each]=obj[each];
    }
  }
}
var oB=new b();
oB.extends(new a());
alert(oB instanceof a); // false
alert(oB.num);     // 123
oB.say();        // happy new year

五、混合繼承法

顧名思義就是把上面幾種繼承法綜合起來(lái)，取長(zhǎng)補(bǔ)短，讓繼承更完善。常見(jiàn)的有構(gòu)造+原型繼承：偽經(jīng)典繼承

function a(){
  this.num=123;
  this.say=function(){
  alert("happy new year！");
  }
}
function b(){
  a.apply(this);
}
b.prototype=new a();
b.prototype.z=123;
var oB=new b();
alert(oB instanceof a); // true
alert(oB.num);     // 123
oB.say();        // happy new year

六、各種繼承法的優(yōu)缺點(diǎn)