JS原型、原型鍊深入了解

原型是JavaScript中一個比較難了解的概念，原型相關的屬性也比較多，對象有”prototype”屬性，函數對象有”prototype”屬性，原型對象有”constructor”屬性。

一、初識原型

在JavaScript中，原型也是一個對象，通過原型可以實作對象的屬性繼承，JavaScript的對象中都包含了一個”[[Prototype]]”内部屬性，這個屬性所對應的就是該對象的原型。

“[[Prototype]]”作為對象的内部屬性，是不能被直接通路的。是以為了友善檢視一個對象的原型，Firefox和Chrome中提供了__proto__這個非标準（不是所有浏覽器都支援）的通路器（ECMA引入了标準對象原型通路器”Object.getPrototype(object)”）。在JavaScript的原型對象中，還包含一個”constructor”屬性，這個屬性對應建立所有指向該原型的執行個體的構造函數

二、規則

在JavaScript中，每個函數都有一個prototype屬性，當一個函數被用作構造函數來建立執行個體時，這個函數的prototype屬性值會被作為原型指派給所有對象執行個體（也就是設定執行個體的`__proto__`屬性），也就是說，所有執行個體的原型引用的是函數的prototype屬性。(****`隻有函數對象才會有這個屬性!`****)

new 的過程分為三步：

var p = new Person('張三',20);

1. var p={}; 初始化一個對象p。

2. p._proto_=Person.prototype;，将對象p的 __proto__ 屬性設定為 Person.prototype

3. Person.call(p,”張三”,20);調用構造函數Person來初始化p。

三、初識Object

Object對象本身是一個函數對象。

既然是Object函數，就肯定會有prototype屬性，是以可以看到”Object.prototype”的值就是”Object{}”這個原型對象。反過來，當通路”Object.prototype”對象的”constructor”這個屬性的時候，就得到了Obejct函數。

另外，當通過”Object.prototype._proto_”擷取Object原型的原型的時候，将會得到”null”，也就是說”Object {}”原型對象就是原型鍊的終點了。

四、初識Function

如上面例子中的構造函數，JavaScript中函數也是對象，是以就可以通過_proto_查找到構造函數對象的原型。

Function對象作為一個函數，就會有prototype屬性，該屬性将對應”function () {}”對象。