var person={name:'ninja'};
person.prototype.sayName=function(){return this.name;
}

分析上面這段代碼，看看有沒有問題？

沒錯，這段代碼是有問題的，我們可以通過Chrome看一下執行結果：

錯誤提示說找不到sayName 屬性，不是記得說Javascript可以隨時新增屬性的嗎？沒錯，Javascript確實可以添加屬性，但是不是針對對象實例本身的，而是針對其對實例對象所屬的類型的對象的。是不是聽起來有些別扭，沒錯，在Javascript的世界里，一切皆是對象，在其所屬類型的對象里含有一個prototype的屬性（這個prototype屬性其實也是一個對象），而在類型的對象的實例的對象里，也存在一個__proto__的屬性，這個屬性其實可以理解為是prototype的一個引用。

這樣說起來是不是有些難于理解，好的，那讓我們重新整理一下上面的例子：

var Person=function(name){this.name=name;
};Person.prototype.sayName=function(){return this.name;
};var a_person=new Person('ninja');
var name=a_person.sayName();

在這個例子里Person就是類型的對象，a_person就是該類型對象的一個實例對象

?

現在我們在看一下這兩個對象里屬性的具體情況。

1. 類型對象Person：在其中有一個屬性prototype:Object,它是一個對象，其下面有一個Constructor的屬性，對應的其實也就是當時定義該類型時候所寫的function簽名，也就是說這個Constructor其實是一個function類型,可以嘗試用 typeof(Person.Constructor)測試一下，它的結果返回的是“function”.
2. Person的實例對象a_person，下面有一個_proto_的屬性，其實它也就是類型對象實例里prototype的一個引用，可以使用這樣的代碼去驗證“Person.prototype===a_person.__proto__”，發現其結果返回的是true， 也許你會注意到在__proto__下面的屬性里還有一個__proto__,這個其實就是link到了Object.Prototype了，這也就是常說的原型鏈的概念。

PS:

也許很多人會分不清在Javascript里面大寫的Function和小寫的function的區別。

其實仔細分析一下代碼，也不難發現，Function其實就是所有function的所屬類型的一個對象。

是不是還是很拗口，其實原理也和上面一樣，只不過這個Function的類型是Javascript自己定義的而已，來看一下代碼吧：

?

從上面的截圖中可以看出在prototype中已經定義了我們常常見到的一些方法appy，bind,call.

下面我們定義一個匿名方法，其實也就是Function的一個實例對象

我們看一下具體的構造：

發現了吧，它的__proto__其實就是Function里的引用：

細心的朋友應該會發現，當我們定義一個function類型對象后，展開它的屬性我們會會看到兩個prototype的相關的屬性，一個是__proto__,另外一個是prototype;

正如前面所說__proto__是Function的prototype的引用；prototype是該類型對象本身的一個引用。

不知道讀這篇文章的你是否搞明白了，我想我是已經明白了：）

?

?

轉載于:https://www.cnblogs.com/shineqiujuan/p/3176786.html

總結

以上是生活随笔為你收集整理的细心看完这篇文章，刷新对Javascript Prototype的理解的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。