在前面的內(nèi)容中访娶,給大家講解了JavaScript中的原型是什么商虐,但是其實JavaScript的原型最好的用法就是運用在面向?qū)ο缶幊痰睦^承中。
今天就來只給大家講一下崖疤,幾種常用的原型繼承運用方法秘车,也方便大家理解記憶〗俸撸看完可以點個收藏叮趴,時刻復(fù)習。
原型繼承
原型繼承:每一個構(gòu)造函數(shù)都有prototype原型屬性沦偎,通過構(gòu)造函數(shù)創(chuàng)建出來的對象都繼承自該原型屬性疫向。所以可以通過更改構(gòu)造函數(shù)的原型屬性來實現(xiàn)繼承。
在JavaScript中豪嚎,繼承的方式有多種,可以一個對象繼承另一個對象谈火,也可以通過原型繼承的方式進行繼承侈询。
給大家演示講解一下幾種繼承方式。
1糯耍、簡單混入繼承
直接遍歷一個對象扔字,將所有的屬性和方法加到另一對象上囊嘉。
缺點:只能一個對象繼承自另一個對象,代碼復(fù)用太低了革为。
2扭粱、混入式原型繼承
混入式原型繼承其實與上面的方法類似,只不過是將遍歷的對象添加到構(gòu)造函數(shù)的原型上震檩。
面向?qū)ο笏枷敕庋b一個原型繼承
我們可以利用面向?qū)ο蟮乃枷胱粮颍瑢⒚嫦蜻^程進行封裝。
3抛虏、替換式原型繼承
替換式原型繼承博其,在上面已經(jīng)舉過例子了,其實就是將一個構(gòu)造函數(shù)的原型對象替換成另一個對象迂猴。
之前我們就說過慕淡,這樣做會產(chǎn)生一個問題,就是替換的對象會重新開辟一個新的空間沸毁。
替換式原型繼承時的bug
替換原型對象的方式會導(dǎo)致原型的constructor的丟失峰髓,constructor屬性是默認原型對象指向構(gòu)造函數(shù)的,就算是替換了默認原型對象息尺,這個屬性依舊是默認原型對象指向構(gòu)造函數(shù)的携兵,所以新的原型對象是沒有這個屬性的。
解決方法:手動關(guān)聯(lián)一個constructor屬性
4掷倔、Object.create()方法實現(xiàn)原型繼承
當我們想把對象1作為對象2的原型的時候眉孩,就可以實現(xiàn)對象2繼承對象1。前面我們了解了一個屬性:__proto__勒葱,實例出來的對象可以通過這個屬性訪問到它的原型浪汪,但是這個屬性只適合開發(fā)調(diào)試時使用,并不能直接去替換原型對象凛虽。所以這里介紹一個新的方法:Object.create()死遭。
語法:
var obj1 = Object.create(原型對象);
示例代碼: 讓空對象obj1繼承對象obj的屬性和方法
兼容性:
由于這個屬性是ECMAScript5的時候提出來的,所以存在兼容性問題凯旋。
利用瀏覽器的能力檢測呀潭,如果存在Object.create則使用,如果不存在的話至非,就創(chuàng)建構(gòu)造函數(shù)來實現(xiàn)原型繼承钠署。
好了,今天的講解就到這里荒椭,看完點個好看支持一下吧谐鼎。