前端 知識點 prototype與_proto_

prototype和 _ proto_ 的關係是什麼？

• __ proto__是每個對象都有的一個屬性，而prototype是函數纔會有的屬性。

• __ proto__指向的是當前對象的原型對象，而prototype指向的，是以當前函數作爲構造函數構造出來的對象的原型對象

• 每個對象的__ proto__屬性指向自身構造函數的prototype

對於以下的代碼：

<script type="text/javascript">
	var Person = function () { };
	Person.prototype.Say = function () {
	alert("Person say");
	}
	var p = new Person();
	p.Say();
</script>

爲什麼p可以訪問Person的Say？

首先 __ proto__是什麼？在這裏簡單地說下。每個對象都會在其內部初始化一個屬性，就是 __ proto__，當我們訪問一個對象的屬性時，如果這個對象內部不存在這個屬性，那麼他就會去__ proto__裏找這個屬性，這個__ proto__又會有自己的__ proto__，於是就這樣 一直找下去，也就是我們平時所說的原型鏈的概念。

其次對於var p=new Person()；可以得出p.__ proto__===Person.prototype。那麼當我們調用p.Say()時，首先p中沒有Say這個屬性， 於是，他就需要到他的__ proto__中去找，也就是Person.prototype，而我們在上面定義了 Person.prototype.Say=function(){}; 於是，就找到了這個方法。

<script type="text/javascript">
	var Person = function () { };
	Person.prototype.Say = function () {
	alert("Person say");
}
Person.prototype.Salary = 50000;
 
var Programmer = function () { };
Programmer.prototype = new Person();
Programmer.prototype.WriteCode = function () {
	alert("programmer writes code");
};
 
Programmer.prototype.Salary = 500;
 
var p = new Programmer();
p.Say();
p.WriteCode();
alert(p.Salary);
</script>

推理過程：
（1）var p=new Programmer()可以得出p.__ proto__=Programmer.prototype;

（2）在上面我們指定了Programmer.prototype=new Person();我們來這樣拆分，var p1=new Person();Programmer.prototype=p1;那麼:

p1.__ proto__=Person.prototype;

Programmer.prototype.__ proto__=Person.prototype;

（3）由根據上面得到p.__ proto__=Programmer.prototype。可以得到p.__ proto__.__ proto__=Person.prototype。

好，算清楚了之後我們來看上面的結果,p.Say()。由於p沒有Say這個屬性，於是去p.__ proto__，也就是 Programmer.prototype，也就是p1中去找，由於p1中也沒有Say，那就去p.__ proto__.__ proto__，也就是 Person.prototype中去找，於是就找到了alert(“Person say”)的方法。
其餘的也都是同樣的道理。

最後，其實prototype只是一個假象，他在實現原型鏈中只是起到了一個輔助作用，換句話說，他只是在new的時候有着一定的價值，而原型鏈的本質，其實在於__ proto__！