js物件導向學習8 原型鏈的原理 proto

說到prototype，就不得不先說下new的過程。

我們先看看這樣一段**：

var person = function () ;
var p = new person();

很簡單的一段**，我們來看看這個new究竟做了什麼？我們可以把new的過程拆分成以下三步：

<1> var p={}; 也就是說，初始化乙個物件p。

<2> p.__proto__=person.prototype;

<3> person.call(p);也就是說構造p，也可以稱之為初始化p。

關鍵在於第二步，我們來證明一下：

var person = function () ;
var p = new person();
alert(p.__proto__ === person.prototype);//true

這段**會返回true。說明我們步驟2的正確。

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

按照標準，__proto__是不對外公開的，也就是說是個私有屬性，但是firefox的引擎將他暴露了出來成為了乙個共有的屬性，我們可以對外訪問和設定。

好，概念說清了，讓我們看一下下面這些**：

var person = function () ;
person.prototype.say = function () 
var p = new person();
p.say();

這段**很簡單，相信每個人都這樣寫過，那就讓我們看下為什麼p可以訪問person的say。

首先var p=new person()；可以得出p.__proto__=person.prototype。那麼當我們呼叫p.say()時，首先p中沒有say這個屬性，於是，他就需要到他的__proto__中去找，也就是person.prototype，而我們在上面定義了 person.prototype.say=function(){}; 於是，就找到了這個方法。

好，接下來，讓我們看個更複雜的。

var person = function () ;
person.prototype.say = function () 
person.prototype.salary = 50000;
var programmer = function () ;
programmer.prototype = new person();
programmer.prototype.writecode = function () ;
programmer.prototype.salary = 500;
var p = new programmer();
p.say();
p.writecode();
alert(p.salary);

我們來做這樣的推導：

var p=new programmer()可以得出p.__proto__=programmer.prototype;

而在上面我們指定了programmer.prototype=new person();我們來這樣拆分，var p1=new person();programmer.prototype=p1;那麼:

p1.__proto__=person.prototype;

programmer.prototype.__proto__=person.prototype;

由根據上面得到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__！

js物件導向學習8 原型鏈的原理 proto

JS物件導向之原型鏈

JS 物件 JS原型原型鏈

JS 物件導向之繼承原型鏈

js物件導向學習8 原型鏈的原理 proto

JS物件導向之原型鏈

JS 物件 JS原型 原型鏈

JS 物件導向之繼承 原型鏈

相關推薦

JS 物件 JS原型原型鏈

JS 物件導向之繼承原型鏈