大家好泼各,我是IT修真院成都分院第09期學(xué)員夷磕,一枚正直純潔善良的web程序員履肃。今天給大家分享一下,修真院官網(wǎng)js任務(wù)4坐桩,原型鏈和訪問(wèn)對(duì)象原型的方法尺棋?
1.背景介紹
JavaScript 中,萬(wàn)物皆對(duì)象撕攒。 JavaScript根據(jù)"原型鏈"(prototype chain)模式陡鹃,來(lái)實(shí)現(xiàn)繼承烘浦。
二.知識(shí)剖析
1.? 對(duì)象:
JavaScript中抖坪,對(duì)象是有區(qū)別的,分為普通對(duì)象和函數(shù)對(duì)象闷叉。
o1 o2 o3 為普通對(duì)象擦俐,f1 f2 f3 為函數(shù)對(duì)象。
2.? 對(duì)象繼承
Brendan Eich參考C++和Java握侧,做了簡(jiǎn)化設(shè)計(jì)蚯瞧,將new命令引入JavaScript中,new后面跟對(duì)象的構(gòu)造函數(shù)品擎,用來(lái)創(chuàng)建對(duì)象埋合。這樣做有個(gè)缺點(diǎn):無(wú)法共享方法和屬性.。
Brendan Eich決定為構(gòu)造函數(shù)設(shè)置一個(gè)prototype屬性萄传。這個(gè)屬性包含一個(gè)對(duì)象甚颂,所有實(shí)例對(duì)象需要共享的屬性和方法,都放在這個(gè)對(duì)象里面秀菱;
那些不需要共享的屬性和方法振诬,就放在構(gòu)造函數(shù)里面。
實(shí)例對(duì)象一旦創(chuàng)建衍菱,將自動(dòng)引用prototype的屬性和方法赶么。也就是說(shuō),實(shí)例對(duì)象的屬性和方法脊串,分成兩種辫呻,一種是本地的,另一種是引用的琼锋。
species屬性放在prototype對(duì)象里印屁,是兩個(gè)實(shí)例對(duì)象共享的。只要修改了prototype對(duì)象斩例,就會(huì)同時(shí)影響到兩個(gè)實(shí)例對(duì)象
DOG.prototype.species = '貓科';
console.log(dogA.species); // 貓科
console.log(dogB.species); // 貓科
由于所有的實(shí)例對(duì)象共享同一個(gè)prototype對(duì)象雄人,那么從外界看起來(lái),prototype對(duì)象就好像是實(shí)例對(duì)象的原型,而實(shí)例對(duì)象則好像"繼承"了prototype對(duì)象一樣础钠。
3.? 原型prototype
在JavaScript 中恰力,每當(dāng)定義一個(gè)對(duì)象(函數(shù))時(shí)候,對(duì)象中都會(huì)包含一些預(yù)定義的屬性旗吁。其中函數(shù)對(duì)象的一個(gè)屬性就是原型對(duì)象 prototype踩萎。普通對(duì)象沒(méi)有prototype,但有_ proto _屬性。
4.??原型鏈
JS在創(chuàng)建對(duì)象(不論是普通對(duì)象還是函數(shù)對(duì)象)的時(shí)候很钓,都有一個(gè)叫做__proto__的內(nèi)置屬性香府,用于指向創(chuàng)建它的函數(shù)對(duì)象的原型對(duì)象prototype。
5.??constructor屬性
prototype對(duì)象有一個(gè)constructor屬性码倦,默認(rèn)指向prototype對(duì)象所在的構(gòu)造函數(shù)企孩。
由于constructor屬性定義在prototype對(duì)象上面,意味著可以被所有實(shí)例對(duì)象繼承袁稽。
constructor屬性的作用勿璃,是分辨原型對(duì)象到底屬于哪個(gè)構(gòu)造函數(shù)。
6.??總結(jié)
1.原型和原型鏈?zhǔn)荍S實(shí)現(xiàn)繼承的一種模型推汽。
2.原型鏈的形成是真正是靠__proto__ 而非prototype补疑。
三.常見(jiàn)問(wèn)題
訪問(wèn)對(duì)象原型的方法有哪些?
四.解決方案
獲取實(shí)例對(duì)象obj的原型對(duì)象歹撒,有三種方法
1. obj.__proto__
2. obj.constructor.prototype
3. Object.getPrototypeOf(obj)
五.編碼實(shí)戰(zhàn)
六.擴(kuò)展思考
1.Object.__proto__ === Function.prototype // true
2.Function.__proto__ === Function.prototype // true?
3.Function.prototype.__proto__=== Object.prototype //true
1.Object是函數(shù)對(duì)象莲组,是通過(guò)new Function()創(chuàng)建,所以O(shè)bject.__proto__指向Function.prototype暖夭。
2.Function 也是對(duì)象函數(shù)锹杈,也是通過(guò)new Function()創(chuàng)建,所以Function.__proto__指向Function.prototype鳞尔。
3.Function.prototype是個(gè)函數(shù)對(duì)象嬉橙,理論上其__proto__應(yīng)該指向 Function.prototype,就是它自己寥假,自己指向自己市框,沒(méi)有意義。函數(shù)對(duì)象也是對(duì)象糕韧,給它設(shè)定根指向Object.prototype枫振,Object.prototype.__proto__=== null,保證原型鏈能夠正常結(jié)束萤彩。
7.參考文獻(xiàn)
參考一:阮一峰:Javascript繼承機(jī)制的設(shè)計(jì)思想
8.更多討論
鳴謝
感謝 王蒙師兄粪滤,此教程是在他們之前技術(shù)分享的基礎(chǔ)上完善而成
感謝大家觀看
騰訊視頻:
今天的分享就到這里啦,歡迎大家點(diǎn)贊雀扶、轉(zhuǎn)發(fā)杖小、留言肆汹、拍磚~
我們下周再見(jiàn)!
------------------------------------------------------------------------------------------------------------------------
技能樹(shù).IT修真院
“我們相信人人都可以成為一個(gè)工程師予权,現(xiàn)在開(kāi)始昂勉,找個(gè)師兄,帶你入門(mén)扫腺,掌控自己學(xué)習(xí)的節(jié)奏岗照,學(xué)習(xí)的路上不再迷茫”笆环。
這里是技能樹(shù).IT修真院攒至,成千上萬(wàn)的師兄在這里找到了自己的學(xué)習(xí)路線,學(xué)習(xí)透明化躁劣,成長(zhǎng)可見(jiàn)化迫吐,師兄1對(duì)1免費(fèi)指導(dǎo)∠熬睿快來(lái)與我一起學(xué)習(xí)吧~