JavaScript如何借用構(gòu)造函數(shù)繼承
這篇文章主要介紹了JavaScript如何借用構(gòu)造函數(shù)繼承,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下
借用構(gòu)造函數(shù)繼承是在子類型構(gòu)造函數(shù)的內(nèi)部調(diào)用超類型構(gòu)造函數(shù),通過使用apply()和call()方法
function girlFriend(){ this.girls = ['chen','wang','zhu']; } function Person(){ girlFriend.call(this,20); } var wang = new Person(); var zhu = new Person(); wang.girls.push('zhang'); console.log(wang.girls); //(4) ["chen", "wang", "zhu", "zhang"] console.log(zhu.girls); //(3) ["chen", "wang", "zhu"]
通過以上代碼,我們可以發(fā)現(xiàn),在原型鏈繼承中出現(xiàn)的問題不再出現(xiàn)了,這個超類不會被子類所創(chuàng)建的實例共享了。
借用構(gòu)造函數(shù)繼承的優(yōu)勢是可以在子類型構(gòu)造函數(shù)中向超類型構(gòu)造函數(shù)傳遞參數(shù),例如以下代碼:
function SuperType(name){ this.name = name; } function SubType(){ SuperType.call(this,"nick"); this.age = 20; } var instance = new SubType(); console.log(instance.name); //nick console.log(instance.age); //20
借用構(gòu)造函數(shù)繼承的問題:用構(gòu)造函數(shù)繼承并不能繼承到超類型原型中定義的方法,例如以下代碼,在girlFriends構(gòu)造函數(shù)的原型中添加sayHello方法:
girlFriend.prototype.sayHello = function(){ console.log('hello'); }
繼承它的子類構(gòu)造函數(shù)的實例并不能調(diào)用到這個sayHello方法,返回的值是undefined
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript中的"=、==、==="區(qū)別講解
今天小編就為大家分享一篇關(guān)于JavaScript中的"=、==、==="區(qū)別講解,小編覺得內(nèi)容挺不錯的,現(xiàn)在分享給大家,具有很好的參考價值,需要的朋友一起跟隨小編來看看吧2019-01-01漂亮的widgets,支持換膚和后期開發(fā)新皮膚(2007-4-27已更新1.7alpha)
漂亮的widgets,支持換膚和后期開發(fā)新皮膚(2007-4-27已更新1.7alpha)...2007-04-04微信小程序?qū)崿F(xiàn)商品屬性聯(lián)動選擇
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)商品屬性聯(lián)動選擇,具有一定的參考價值,感興趣的小伙伴們可以參考一下2019-02-02JavaScript中SQL語句的應(yīng)用實現(xiàn)
最近一直在用javascript在做項目 可是做著做著 感覺很多功能代碼都是重復(fù)的。2010-05-05解決layui前端框架 form表單,table表等內(nèi)置控件不顯示的問題
今天小編就為大家分享一篇解決layui前端框架 form表單,table表等內(nèi)置控件不顯示的問題,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08微信小程序仿抖音視頻之整屏上下切換功能的實現(xiàn)代碼
這篇文章主要介紹了微信小程序仿抖音視頻之整屏上下切換功能,本文通過實例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-05-05javascript實現(xiàn)dom動態(tài)創(chuàng)建省市縱向列表菜單的方法
這篇文章主要介紹了javascript實現(xiàn)dom動態(tài)創(chuàng)建省市縱向列表菜單的方法,可實現(xiàn)省市列表菜單效果,涉及javascript鼠標(biāo)事件及頁面處理json數(shù)據(jù)的技巧,需要的朋友可以參考下2015-05-05Bootstrap~多級導(dǎo)航(級聯(lián)導(dǎo)航)的實現(xiàn)效果【附代碼】
下面小編就為大家分享一篇Bootstrap~多級導(dǎo)航(級聯(lián)導(dǎo)航)的實現(xiàn)效果【附代碼】。小編覺得挺不錯。希望對大家有所幫助。一起跟隨小編過來看看吧2016-03-03