Javascript編程之繼承實(shí)例匯總
本文實(shí)例講述了Javascript編程之繼承。分享給大家供大家參考,具體如下:
這篇文字是在看完《Javascript 王者歸來(lái)》后的整理總結(jié),文章詳細(xì)章節(jié)在 第21章 P537
繼承一般要實(shí)現(xiàn)以下三層含義:
1)子類實(shí)例可以共享父類的方法;
2)子類可以覆蓋父類的方法或者擴(kuò)展新的方法;
3)子類和父類都是子類實(shí)例的類型。
一、構(gòu)造繼承法
子類中調(diào)用父類的構(gòu)造函數(shù)來(lái)維護(hù)的,該繼承法能實(shí)現(xiàn)多重繼承,但只能繼承父類的共有方法,無(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)造法不能繼承類型的靜態(tài)方法,原型繼承得不完善(某些核心對(duì)象的不可枚舉方法不能繼承),而實(shí)例繼承法能對(duì)原生核心對(duì)象或者DOM對(duì)象進(jìn)行繼承,它通過(guò)在類型中構(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ò)拷貝基類對(duì)象的所有可枚舉屬性和方法來(lái)模擬繼承,因此它可以模擬多繼承,但不能枚舉的就無(wú)法繼承;它可以繼承父類的靜態(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ǔ)短,讓繼承更完善。常見的有 構(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)

希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
JavaScript類數(shù)組對(duì)象轉(zhuǎn)換為數(shù)組對(duì)象的方法實(shí)例分析
這篇文章主要介紹了JavaScript類數(shù)組對(duì)象轉(zhuǎn)換為數(shù)組對(duì)象的方法,結(jié)合實(shí)例形式分析了javascript類數(shù)組對(duì)象的功能,以及類數(shù)組對(duì)象轉(zhuǎn)換為數(shù)組對(duì)象的相關(guān)方法與實(shí)現(xiàn)技巧,需要的朋友可以參考下2018-07-07
JavaScript之class繼承_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
這篇文章主要介紹了JavaScript之class繼承,新的關(guān)鍵字class從ES6開始正式被引入到JavaScript中。class的目的就是讓定義類更簡(jiǎn)單,有興趣的可以了解一下2017-07-07
JavaScript屏蔽指定區(qū)域內(nèi)右鍵菜單
有時(shí)候需要屏蔽部分區(qū)域內(nèi)的右鍵菜單,下面的代碼大家可以測(cè)試下。2010-03-03
js實(shí)現(xiàn)人才網(wǎng)站職位選擇功能的方法
這篇文章主要介紹了js實(shí)現(xiàn)人才網(wǎng)站職位選擇功能的方法,涉及javascript動(dòng)態(tài)操作頁(yè)面元素結(jié)點(diǎn)的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-08-08
JavaScript中5種調(diào)用函數(shù)的方法
這篇文章主要介紹了JavaScript中5種調(diào)用函數(shù)的方法,本文詳細(xì)的介紹了Javascript中各種函數(shù)調(diào)用的方法及其原理,對(duì)于理解JavaScript的函數(shù)有很大的幫助,需要的朋友可以參考下2015-03-03
textarea 控制輸入字符字節(jié)數(shù)(示例代碼)
本篇文章主要是對(duì)textarea 控制輸入字符字節(jié)數(shù)的示例代碼進(jìn)行了介紹,需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助2013-12-12
js substring從右邊獲取指定長(zhǎng)度字符串(示例代碼)
本篇文章主要是對(duì)js substring從右邊獲取指定長(zhǎng)度字符串的示例代碼進(jìn)行了介紹,需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助2013-12-12
代碼精簡(jiǎn)的可以實(shí)現(xiàn)元素圓角的js函數(shù)
代碼精簡(jiǎn)的可以實(shí)現(xiàn)元素圓角的js函數(shù)...2007-07-07

