其實JavaScript的原型最好的用法就是運用在面向?qū)ο缶幊痰睦^承中航罗,今天就來給大家講一下禀横,幾種常用的原型繼承運用方法。
原型繼承
原型繼承:每一個構(gòu)造函數(shù)都有prototype原型屬性粥血,通過構(gòu)造函數(shù)創(chuàng)建出來的對象都繼承自該原型屬性柏锄。所以可以通過更改構(gòu)造函數(shù)的原型屬性來實現(xiàn)繼承酿箭。
在JavaScript中,繼承的方式有多種趾娃,可以一個對象繼承另一個對象缭嫡,也可以通過原型繼承的方式進(jìn)行繼承。
接下來給大家演示講解一下幾種繼承方式:
01.簡單混入繼承
直接遍歷一個對象抬闷,將所有的屬性和方法加到另一對象上妇蛀。
缺點:只能一個對象繼承自另一個對象,代碼復(fù)用太低了笤成。
02.混入式原型繼承
混入式原型繼承其實與上面的方法類似评架,只不過是將遍歷的對象添加到構(gòu)造函數(shù)的原型上。
面向?qū)ο笏枷敕庋b一個原型繼承
我們可以利用面向?qū)ο蟮乃枷肟挥荆瑢⒚嫦蜻^程進(jìn)行封裝纵诞。
03.替換式原型繼承
替換式原型繼承,在上面已經(jīng)舉過例子了培遵,其實就是將一個構(gòu)造函數(shù)的原型對象替換成另一個對象浙芙。
之前我們就說過,這樣做會產(chǎn)生一個問題籽腕,就是替換的對象會重新開辟一個新的空間嗡呼。
替換式原型繼承時的bug
替換原型對象的方式會導(dǎo)致原型的constructor的丟失,constructor屬性是默認(rèn)原型對象指向構(gòu)造函數(shù)的皇耗,就算是替換了默認(rèn)原型對象南窗,這個屬性依舊是默認(rèn)原型對象指向構(gòu)造函數(shù)的,所以新的原型對象是沒有這個屬性的廊宪。
解決方法:手動關(guān)聯(lián)一個constructor屬性
04.Object.create()方法實現(xiàn)原型繼承
當(dāng)我們想把對象1作為對象2的原型的時候矾瘾,就可以實現(xiàn)對象2繼承對象1。前面我們了解了一個屬性:__proto__箭启,實例出來的對象可以通過這個屬性訪問到它的原型,但是這個屬性只適合開發(fā)調(diào)試時使用蛉迹,并不能直接去替換原型對象傅寡。
所以這里介紹一個新的方法:Object.create()。
語法:
兼容性:
由于這個屬性是ECMAScript5的時候提出來的北救,所以存在兼容性問題荐操。
利用瀏覽器的能力檢測,如果存在Object.create則使用珍策,如果不存在的話托启,就創(chuàng)建構(gòu)造函數(shù)來實現(xiàn)原型繼承。