JavaScript 徹底理解JavaScript原型

JavaScript 徹底理解JavaScript原型

ID:42623747

大?。?91.94 KB

頁(yè)數(shù):21頁(yè)

時(shí)間:2019-09-19

JavaScript 徹底理解JavaScript原型_第1頁(yè)
JavaScript 徹底理解JavaScript原型_第2頁(yè)
JavaScript 徹底理解JavaScript原型_第3頁(yè)
JavaScript 徹底理解JavaScript原型_第4頁(yè)
JavaScript 徹底理解JavaScript原型_第5頁(yè)
資源描述:

《JavaScript 徹底理解JavaScript原型》由會(huì)員上傳分享,免費(fèi)在線閱讀,更多相關(guān)內(nèi)容在教育資源-天天文庫(kù)

1、徹底理解JavaScript原型原型是JavaScript中一個(gè)比較難理解的概念,原型相關(guān)的屬性也比較多,對(duì)象有"[[prototype]]"屬性,函數(shù)對(duì)象有"prototype"屬性,原型對(duì)象有"constructor"屬性。為了弄清原型,以及原型相關(guān)的這些屬性關(guān)系,就有了這篇文章。相信通過這篇文章一定能夠清楚的認(rèn)識(shí)到原型,現(xiàn)在就開始原型之旅吧。認(rèn)識(shí)原型開始原型的介紹之前,首先來認(rèn)識(shí)一下什么是原型?在JavaScript中,原型也是一個(gè)對(duì)象,通過原型可以實(shí)現(xiàn)對(duì)象的屬性繼承,JavaScript

2、的對(duì)象中都包含了一個(gè)"[[Prototype]]"內(nèi)部屬性,這個(gè)屬性所對(duì)應(yīng)的就是該對(duì)象的原型。"[[Prototype]]"作為對(duì)象的內(nèi)部屬性,是不能被直接訪問的。所以為了方便查看一個(gè)對(duì)象的原型,F(xiàn)irefox和Chrome中提供了"__proto__"這個(gè)非標(biāo)準(zhǔn)(不是所有瀏覽器都支持)的訪問器(ECMA引入了標(biāo)準(zhǔn)對(duì)象原型訪問器"Object.getPrototype(object)")。實(shí)例分析下面通過一個(gè)例子來看看原型相關(guān)概念:functionPerson(name,age){this.na

3、me=name;this.age=age;this.getInfo=function(){console.log(this.name+"is"+this.age+"yearsold");};}varwill=newPerson("Will",28);在上面的代碼中,通過了Person這個(gè)構(gòu)造函數(shù)創(chuàng)建了一個(gè)will對(duì)象。下面就通過will這個(gè)對(duì)象一步步展開了解原型。?Step1:查看對(duì)象will的原型通過下面代碼,可以查看對(duì)象will的原型:console.log(will.__proto__);

4、console.log(will.constructor);結(jié)果分析:·"Person{}"對(duì)象就是對(duì)象will的原型,通過Chrome展開可以看到,"Person{}"作為一個(gè)原型對(duì)象,也有"__proto__"屬性(對(duì)應(yīng)原型的原型)?!ぴ谶@段代碼中,還用到了"constructor"屬性。在JavaScript的原型對(duì)象中,還包含一個(gè)"constructor"屬性,這個(gè)屬性對(duì)應(yīng)創(chuàng)建所有指向該原型的實(shí)例的構(gòu)造函數(shù)。o通過"constructor"這個(gè)屬性,我們可以來判斷一個(gè)對(duì)象是不是數(shù)組類型o

5、functionisArray(myArray){oreturnmyArray.constructor.toString().indexOf("Array")>-1;}o在這里,will對(duì)象本身并沒有"constructor"這個(gè)屬性,但是通過原型鏈查找,找到了will原型(will.__proto__)的"constructor"屬性,并得到了Person函數(shù)。?Step2:查看對(duì)象will的原型(will.__proto__)的原型既然will的原型"Person{}"也是一個(gè)對(duì)象,那么我們

6、就同樣可以來查看"will的原型(will.__proto__)的原型"。運(yùn)行下面的代碼:console.log(will.__proto__===Person.prototype);console.log(Person.prototype.__proto__);console.log(Person.prototype.constructor);console.log(Person.prototype.constructor===Person);結(jié)果分析:·首先看"will.__proto__=

7、==Person.prototype",在JavaScript中,每個(gè)函數(shù)都有一個(gè)prototype屬性,當(dāng)一個(gè)函數(shù)被用作構(gòu)造函數(shù)來創(chuàng)建實(shí)例時(shí),該函數(shù)的prototype屬性值將被作為原型賦值給所有對(duì)象實(shí)例(也就是設(shè)置實(shí)例的__proto__屬性),也就是說,所有實(shí)例的原型引用的是函數(shù)的prototype屬性。了解了構(gòu)造函數(shù)的prototype屬性之后,一定就明白為什么第一句結(jié)果為true了。oprototype屬性是函數(shù)對(duì)象特有的,如果不是函數(shù)對(duì)象,將不會(huì)有這樣一個(gè)屬性?!ぎ?dāng)通過"Person

8、.prototype.__proto__"語句獲取will對(duì)象原型的原型時(shí)候,將得到"Object{}"對(duì)象,后面將會(huì)看到所有對(duì)象的原型都將追溯到"Object{}"對(duì)象。·對(duì)于原型對(duì)象"Person.prototype"的"constructor",根據(jù)前面的介紹,將對(duì)應(yīng)Person函數(shù)本身。通過上面可以看到,"Person.prototype"對(duì)象和Person函數(shù)對(duì)象通過"constructor"和"prototype"屬性實(shí)現(xiàn)了相互引用(后面會(huì)有圖展示這個(gè)相互引用的關(guān)系)。?Step3:

當(dāng)前文檔最多預(yù)覽五頁(yè),下載文檔查看全文

此文檔下載收益歸作者所有

當(dāng)前文檔最多預(yù)覽五頁(yè),下載文檔查看全文
溫馨提示:
1. 部分包含數(shù)學(xué)公式或PPT動(dòng)畫的文件,查看預(yù)覽時(shí)可能會(huì)顯示錯(cuò)亂或異常,文件下載后無此問題,請(qǐng)放心下載。
2. 本文檔由用戶上傳,版權(quán)歸屬用戶,天天文庫(kù)負(fù)責(zé)整理代發(fā)布。如果您對(duì)本文檔版權(quán)有爭(zhēng)議請(qǐng)及時(shí)聯(lián)系客服。
3. 下載前請(qǐng)仔細(xì)閱讀文檔內(nèi)容,確認(rèn)文檔內(nèi)容符合您的需求后進(jìn)行下載,若出現(xiàn)內(nèi)容與標(biāo)題不符可向本站投訴處理。
4. 下載文檔時(shí)可能由于網(wǎng)絡(luò)波動(dòng)等原因無法下載或下載錯(cuò)誤,付費(fèi)完成后未能成功下載的用戶請(qǐng)聯(lián)系客服處理。