JavaScript各種繼承方式(四):原型式繼承
阿新 • • 發佈:2018-12-28
一 原理
利用工具函式,通過原型物件直接得到子類的例項。
function inherit(obj){ // 在閉包中建立子類,對外隱藏子類 function Temp(){ } Temp.prototype = obj; // 直接返回子類的例項 return new Temp(); } let fruit = { name:'水果', nutrition:['維生素'] }; let mango1 = inherit(fruit); let mango2 = inherit(fruit); mango1.nutrition.push('膳食纖維'); mango2.nutrition.push('檸檬酸'); console.log(mango1.nutrition); // ["維生素", "膳食纖維", "檸檬酸"] console.log(mango2.nutrition); // ["維生素", "膳食纖維", "檸檬酸"]
二 優點
不涉及父類的建構函式,不呼叫父類的建構函式就能實現繼承。
三 缺點
本質上還是原型鏈繼承,只是通過工具函式進行了封裝,仍然存在子類的例項共享原型物件的問題。
四 簡化
ECMAScript 5提供了Object.create()方法,可以用做工具函式。
let fruit = { name:'水果', nutrition:['維生素'] }; let mango1 = Object.create(fruit); let mango2 = Object.create(fruit); mango1.nutrition.push('膳食纖維'); mango2.nutrition.push('檸檬酸'); console.log(mango1.nutrition); // ["維生素", "膳食纖維", "檸檬酸"] console.log(mango2.nutrition); // ["維生素", "膳食纖維", "檸檬酸"]