javascript中的原型鏈深入理解_基礎知識

要弄清楚原型鏈就要先弄清楚 function 類型，在javascript中沒有類別的概念，都是函數，所以它是一門函數式的程式語言。類別有一個很重要的特性，就是它可以根據它的建構子來建立以它為模板的物件。在javascript中，函數就有2個函數

第一、 作為一般函數呼叫
第二、 作為它原型物件的建構子也就new()

我們來看一個例子

複製程式碼 程式碼如下:

function a){
. name = 'a';
}

當建立一個函數，它會發生什麼事？

第一、它會建立1個函數物件也就是a 本身

第二、它會建立1個原型物件@a(用@來表示)

第三、函數物件會有一個prototype指針，它指向了對應的原型對象，這裡就指向了@a

第四、@a對像中有一個construtor指針，指向它的構造函數，這裡就指向了a 70/ gravity/SouthEast

這個prototype屬性究竟有什麼用呢？

其實prototype 屬性表示目前函數能夠控制的範圍（或說它指明了目前函數是誰的建構子），這裡a就是@a原型物件的建構函數，所以我們會看見有這種寫法

複製程式碼 程式碼如下:

function a(()) .name = 'a';

}

var a1 = new a();



這就和其他常見語言相似了，new 就是調用原型物件（透過prototype指標）裡面建構函數（constructor）建立一個新的物件實例。

那麼修改了prototype指向物件裡面的屬性，也就影響了所有以它為模板建立的實例，我們可以這樣來驗證

複製程式碼 程式碼如下: function a(){

this.name = 'a';

}

this.name = 'a';
}


var a1 = new a();
a.prototype.age = 1;
alert(a1.age);

結果：1

那為什麼a1物件可以直接存取到age屬性呢？ a1物件裡面我並沒有定義age屬性啊，

那是因為所有實例裡面都會有一個引用_proto_(在firfox，chrome下可以直接訪問，ie不支援)指向了這個原型，這裡就是指向了@a，

複製程式碼

程式碼如下:

function a(){


function a(){

function a(){


function a(){ >this.name = 'a';
}

var a1 = new a();
alert(a1._proto_ == a.prototype)

結果：true 在存取屬性的時候，會先在a1物件內部中尋找，如果沒有，就會順著_proto_指向的物件裡面去尋找，這裡會到@a中尋找，找到就回傳值，沒有找到就回傳undefined，用個成語來形容，就是順藤摸瓜嘛！ 至此原型鏈的意義就出來了，由於原型物件也有一個_proto_指針，又指向了另一個原型，一個接一個，就形成了原型鏈。 Object.prototype是最頂層的原型，所以如果修改了Object.prototype的屬性，那就影響了所有的物件。

在來看一段程式碼

複製程式碼


程式碼如下:this.name = 'a';
}

function b(){

this.age = 1;
}

b .prototype = new a(); alert(new b().name); 我們顯示的將b的原型指向了a的一個實例，然後，b的實例也可以存取a的屬性了。這就是javascript的繼承了，那為什麼b.prototype 指向的是a的一個實例，而不是直接指向a.prototype 呢？

複製程式碼

程式碼如下: b.prototype = new a.prototype>；
如果像上面這麼寫,修改p.prototype中的屬性，那麼a的原型也會改變了，相當於是子類修改了父類，並且子類和父類的屬性糅合在了一起，這顯然是不合適的。換句話說，b也成為了@a的構造函數，a，b成了平級的關係。

我們可以下一個定義：

函數a 繼承函數b 也就是讓函數a成為函數b原型的一個實例的建構函數，建構子裡面宣告的屬性是函數a自己的，原型實例裡面的屬性就是繼承b的

複製程式碼 程式碼如下:

var🎜> 程式碼如下:

//不可能在自己的建構子中又一次建構自己，所以回傳了另一個建構子的實例
return new init(selector,context);
}
jQuery.fn = jQuery.prototype = {
size:function(){
return this.length;
}
}
function in>} ,context){

}
init.prototype = jQuery.fn;;
}

這是jquery的一段源碼，我們在使用jquery的時候，並沒有使用new關鍵字，那它是如何建構物件的呢？
用上面的知識，可以解釋，jquery這裡只是一個一般函數的調用，它返回了jquery原型的另外一個構造函數創建的對象，也就是new init()