理解javaScript原型、原型鏈

NSFish 發(fā)布于2019-08-26 18:13 / 1395人閱讀

摘要：構(gòu)造函數(shù)的屬性指向原型對(duì)象原型對(duì)象的屬性指向構(gòu)造函數(shù)實(shí)例對(duì)象的指向原型對(duì)象所有引用類型默認(rèn)都繼承了，而這個(gè)繼承也是通過(guò)原型鏈實(shí)現(xiàn)的。第一種方式是使用操作符，只要用這個(gè)操作符來(lái)測(cè)試實(shí)例與原型鏈中出現(xiàn)過(guò)的構(gòu)造函數(shù)，結(jié)果就會(huì)返回。

理解對(duì)象
首先對(duì)象的定義是:“無(wú)序?qū)傩缘募希鋵傩钥梢园局怠?duì)象或者函數(shù)。”嚴(yán)格來(lái)講，
這就相當(dāng)于說(shuō)對(duì)象是一組沒(méi)有特定順序的值。對(duì)象的每個(gè)屬性或方法都有一個(gè)名字，而每個(gè)名字都映射到一個(gè)值。正因?yàn)檫@樣(以及其他將要討論的原因)，我們可以把 ECMAScript 的對(duì)象想象成散列表:無(wú)非就是一組名值對(duì)，其中值可以是數(shù)據(jù)或函數(shù)。
原型對(duì)象理解
1.創(chuàng)建的每個(gè)函數(shù)都有一個(gè) prototype(原型)屬性，這個(gè)屬性是一個(gè)指針，指向一個(gè)對(duì)象(原型對(duì)象)，而原型對(duì)象的用途是包含可以由特定類型的所有實(shí)例共享的屬性和方法。

2.創(chuàng)建一個(gè)新函數(shù)，會(huì)根據(jù)一組特定的規(guī)則為該函數(shù)創(chuàng)建一個(gè) prototype 屬性（原型屬性），這個(gè)屬性指向函數(shù)的原型對(duì)象。在默認(rèn)情況下，所有原型對(duì)象都會(huì)自動(dòng)獲得一個(gè) constructor (構(gòu)造函數(shù)屬性)屬性，這個(gè)屬性包含一個(gè)指向 prototype 屬性所在函數(shù)的指針。就拿前面的例子來(lái)說(shuō)， Person.prototype.constructor 指向 Person。而通過(guò)這個(gè)構(gòu)造函數(shù)，我們還可繼續(xù)為原型對(duì)象添加其他屬性和方法

3.當(dāng)調(diào)用構(gòu)造函數(shù)創(chuàng)建一個(gè)新實(shí)例后，該實(shí)例的內(nèi)部將包含一個(gè)指針(內(nèi)部屬性)，指向構(gòu)造函數(shù)的原型對(duì)象。ECMA-262 第 5 版中管這個(gè)指針叫[[Prototype]]。雖然在腳本中沒(méi)有標(biāo)準(zhǔn)的方式訪問(wèn)[[Prototype]]，但 Firefox、Safari 和 Chrome 在每個(gè)對(duì)象上都支持一個(gè)屬性 proto;而在其他實(shí)現(xiàn)中，這個(gè)屬性對(duì)腳本則是完全不可見(jiàn)的。不過(guò)，要明確的真正重要的一點(diǎn)就是，這個(gè)連接存在于實(shí)例與構(gòu)造函數(shù)的原型對(duì)象之間，而不是存在于實(shí)例與構(gòu)造函數(shù)之間。Person 的每個(gè)實(shí)例—— person1 和 person2 都包含一個(gè)內(nèi)部屬性，該屬性僅僅指向了 Person.prototype;換句話說(shuō)，它們與構(gòu)造函數(shù)沒(méi)有直接的關(guān)系。

4.實(shí)現(xiàn)中都無(wú)法訪問(wèn)到[[Prototype]]，

1>但可以通過(guò) isPrototypeOf()方法來(lái)確定對(duì)象之間是否存在這種關(guān)系。

2>ECMAScript 5增加了一個(gè)新方法，叫Object.getPrototypeOf()，在所有支持的實(shí)現(xiàn)中，這個(gè)方法返回[[Prototype]]的值。例如:

理解prototype、__proto__與constructor

1>__proto__和constructor屬性是對(duì)象所獨(dú)有的；prototype屬性是函數(shù)所獨(dú)有的，因?yàn)楹瘮?shù)也是一種對(duì)象，所以函數(shù)也擁有__proto__和constructor屬性。
2>__proto__屬性的作用就是當(dāng)訪問(wèn)一個(gè)對(duì)象的屬性時(shí)，如果該對(duì)象內(nèi)部不存在這個(gè)屬性，那么就會(huì)去它的__proto__屬性所指向的那個(gè)對(duì)象（父對(duì)象）里找，一直找，直到__proto__屬性的終點(diǎn)**null**，然后返回undefined，再往上找就相當(dāng)于在null上取值，會(huì)報(bào)錯(cuò)。通過(guò)__proto__屬性將對(duì)象連接起來(lái)的這條鏈路即我們所謂的**原型鏈**。
3>prototype屬性的作用就是讓該函數(shù)所**實(shí)例化的對(duì)象**們都可以找到公用的屬性和方法，即f1.__proto__ === Foo.prototype。
4>constructor屬性的含義就是指向該**對(duì)象的構(gòu)造函數(shù)**，所有函數(shù)（此時(shí)看成對(duì)象了）最終的構(gòu)造函數(shù)都指向Function。

原型鏈
原型鏈?zhǔn)菍?shí)現(xiàn)繼承的主要方法。其基本思想是利用原型讓一個(gè)引用類型繼承另一個(gè)引用類型的屬性和方法。
(構(gòu)造函數(shù))的prototype屬性指向(原型對(duì)象)；
(原型對(duì)象)的constructor屬性指向(構(gòu)造函數(shù));
(實(shí)例對(duì)象)的[[Prototype]]/__proto__指向(原型對(duì)象)

1.所有引用類型默認(rèn)都繼承了 Object，而這個(gè)繼承也是通過(guò)原型鏈實(shí)現(xiàn)的。大家要記住，所有函數(shù)的默認(rèn)原型都是 Object 的實(shí)例，因此默認(rèn)原型都會(huì)包含一個(gè)內(nèi)部指針，指向 Object.prototype。這也正是所有自定義類型都會(huì)繼承 toString()、 valueOf()等默認(rèn)方法的根本原因。所以，我們說(shuō)上面例子展示的原型鏈中還應(yīng)該包括另外一個(gè)繼承層次

確定原型和實(shí)例的關(guān)系

可以通過(guò)兩種方式來(lái)確定原型和實(shí)例之間的關(guān)系。第一種方式是使用 instanceof 操作符，只要用這個(gè)操作符來(lái)測(cè)試實(shí)例與原型鏈中出現(xiàn)過(guò)的構(gòu)造函數(shù)，結(jié)果就會(huì)返回 true。以下幾行代碼就說(shuō)明了這一點(diǎn)。

由于原型鏈的關(guān)系，我們可以說(shuō) instance 是 Object、SuperType 或 SubType 中任何一個(gè)類型的實(shí)例。因此，測(cè)試這三個(gè)構(gòu)造函數(shù)的結(jié)果都返回了 true。
第二種方式是使用 isPrototypeOf()方法。同樣，只要是原型鏈中出現(xiàn)過(guò)的原型，都可以說(shuō)是該原型鏈所派生的實(shí)例的原型，因此 isPrototypeOf()方法也會(huì)返回 true，如下所示。

參考文章