JavaScript實(shí)現(xiàn)多重繼承的方法分析
本文實(shí)例講述了JavaScript實(shí)現(xiàn)多重繼承的方法。分享給大家供大家參考,具體如下:
1. 定義一個(gè)空的父類(lèi)構(gòu)造函數(shù),然后通過(guò)prototype的方式為該父類(lèi)定義屬性和方法
2. 定義一個(gè)空的子類(lèi)的構(gòu)造函數(shù),然后將子類(lèi)的原型綁定在父類(lèi)的實(shí)例上,再將子類(lèi)原型的父類(lèi)也綁定在父類(lèi)的實(shí)例上。通過(guò)prototype的方式為子類(lèi)設(shè)置自己的屬性和方法。
3. 定義一個(gè)空的孫類(lèi)構(gòu)造函數(shù),然后將孫類(lèi)的原型綁定到子類(lèi)的實(shí)例上,再將孫類(lèi)原型的父類(lèi)綁定到子類(lèi)的實(shí)例上。通過(guò)prototype方式為孫類(lèi)定義自己的屬性和方法。
4. 實(shí)例化一個(gè)孫類(lèi)對(duì)象,通過(guò)調(diào)用該實(shí)例對(duì)象,調(diào)用自身的方法,也可以調(diào)用孫類(lèi)的父類(lèi)即文中的子類(lèi)的方法,也可直接調(diào)用最大父類(lèi)即這里父類(lèi)的方法,也可以為當(dāng)前對(duì)象添加屬性和方法。
function Person(){}
Person.prototype.name = "人";// 為人類(lèi)創(chuàng)建一個(gè)name屬性
Person.prototype.say = function(content){// 為人類(lèi)創(chuàng)建一個(gè)說(shuō)話的方法
if(!this.name){ // 如果對(duì)象不存在name屬性,則使用原型鏈的name
this.name = this.__proto__.name;
}
console.log("我是" + this.name + ",我想說(shuō)"+content);
};
function Parent(){}
Parent.prototype = new Person(); // 設(shè)置Parent類(lèi)繼承Person類(lèi)
Parent.prototype.superClass = new Person();// 設(shè)置superClass保存父類(lèi)Person的方法屬性
Parent.prototype.name = "父輩類(lèi)";// 設(shè)置Parent類(lèi)的name屬性
Parent.prototype.say = function(){// 設(shè)置Parent類(lèi)自己的 say 方法
console.log("我是Parent類(lèi)的say方法!");
};
function Child(){}
Child.prototype = new Parent();// 設(shè)置Child類(lèi)繼承Parent類(lèi)
Child.prototype.superClass = new Parent();// 設(shè)置superClass保存父類(lèi)Parent的方法屬性
Child.prototype.say = function(){ //設(shè)置Child類(lèi)自己的say方法
console.log("我是Child類(lèi)的say方法!");
}
var c = new Child();// 實(shí)例化一個(gè)Child對(duì)象
c.say(); // 調(diào)用自身原型的say方法,輸出:我是Child類(lèi)的say方法!
c.superClass.say(); // 調(diào)用父類(lèi)Parent的say方法,輸出: 我是Parent類(lèi)的say方法!
c.superClass.superClass.say("哈哈");// 直接調(diào)用最大的父類(lèi)Person的say方法(方法中的this指向Person),輸出:我是人,我想說(shuō)哈哈"
// 用call調(diào)用最大的父類(lèi)Person的say方法(方法中的this指向?qū)嵗瘜?duì)象c,但此時(shí)c并沒(méi)有name屬性,所以this.name用的是Parent的name)
c.superClass.superClass.say.call(c,"嘻嘻"); // 輸出:我是父輩類(lèi),我想說(shuō)嘻嘻
c.name = "子類(lèi)實(shí)例";// 給當(dāng)前對(duì)象增加name屬性
// 還是用call調(diào)用最大父類(lèi)Person的say方法(此時(shí)c對(duì)象中已經(jīng)有name屬性);
c.superClass.superClass.say.call(c,"我是子類(lèi)的實(shí)例化對(duì)象"); // 輸出:我是子類(lèi)實(shí)例,我想說(shuō)我是子類(lèi)的實(shí)例化對(duì)象
ps:多重繼承可以在原型對(duì)象上新增一個(gè)屬性用以保存父類(lèi)的對(duì)象和屬性,子類(lèi)調(diào)用的時(shí)候使用superClass點(diǎn)出父類(lèi)方法,這樣一來(lái)就解決了父類(lèi)和子類(lèi)方法同名,子類(lèi)繼承父類(lèi)之后會(huì)覆蓋父類(lèi)方法的問(wèn)題。
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專(zhuān)題:《javascript面向?qū)ο笕腴T(mén)教程》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
- JavaScript類(lèi)的繼承操作實(shí)例總結(jié)
- JavaScript使用prototype原型實(shí)現(xiàn)的封裝繼承多態(tài)示例
- JavaScript原型鏈與繼承操作實(shí)例總結(jié)
- JavaScript類(lèi)的繼承方法小結(jié)【組合繼承分析】
- JavaScript是如何實(shí)現(xiàn)繼承的(六種方式)
- 實(shí)現(xiàn)JavaScript中繼承的三種方式
- 深入了解javascript中的prototype與繼承
- Javascript基于對(duì)象三大特性(封裝性、繼承性、多態(tài)性)
- javascript prototype的深度探索不是原型繼承那么簡(jiǎn)單
- javascript的函數(shù)、創(chuàng)建對(duì)象、封裝、屬性和方法、繼承
- JavaScript的原型繼承詳解
- JavaScript繼承的特性與實(shí)踐應(yīng)用深入詳解
相關(guān)文章
基于javascript實(shí)現(xiàn)動(dòng)態(tài)顯示當(dāng)前系統(tǒng)時(shí)間
這篇文章主要介紹了基于javascript實(shí)現(xiàn)動(dòng)態(tài)顯示當(dāng)前系統(tǒng)時(shí)間,以一個(gè)完整實(shí)例形式較為詳細(xì)的分析了js動(dòng)態(tài)顯示當(dāng)前系統(tǒng)時(shí)間的實(shí)現(xiàn)技巧,需要的朋友可以參考下2016-01-01
Javascript實(shí)現(xiàn)獲取窗口的大小和位置代碼分享
這篇文章主要分享了一段Javascript實(shí)現(xiàn)獲取窗口的大小和位置代碼,兼容性非常好,這里推薦給大家2014-12-12
element el-input 刪除邊框的實(shí)現(xiàn)
本文主要介紹了element el-input 刪除邊框的實(shí)現(xiàn),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2023-04-04
javascript實(shí)現(xiàn)任務(wù)欄消息提示的簡(jiǎn)單實(shí)例
下面小編就為大家?guī)?lái)一篇javascript實(shí)現(xiàn)任務(wù)欄消息提示的簡(jiǎn)單實(shí)例。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-05-05
JS實(shí)現(xiàn)兼容各種瀏覽器的高級(jí)拖動(dòng)方法完整實(shí)例【測(cè)試可用】
這篇文章主要介紹了JS實(shí)現(xiàn)兼容各種瀏覽器的高級(jí)拖動(dòng)方法,以完整實(shí)例形式分析了JS實(shí)現(xiàn)響應(yīng)鼠標(biāo)事件動(dòng)態(tài)修改頁(yè)面元素的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2016-06-06
如何解決ligerUI布局時(shí)Center中的Tab高度大小
這篇文章主要介紹了如何解決ligerUI布局時(shí)Center中的Tab高度大小的相關(guān)資料,需要的朋友可以參考下2015-11-11

