首頁  >  文章  >  web前端  >  js中什麼是原型鏈

js中什麼是原型鏈

anonymity
anonymity原創
2019-05-29 10:59:244156瀏覽

每個建構函式都有一個原型對象,原型對像都包含一個指向建構函式的指針,而實例都包含指向原型對象內部的指針。我們讓原型物件的實例(1)等於另一個原型物件(2),

此時原型物件(2)將包含一個指向原型物件(1)的指針,

再讓原型物件(2)的實例等於原型物件(3),如此層層遞進就構成了實例和原型的鏈條,這就是原型鏈的概念

js中什麼是原型鏈

原型鏈

每個建構子都有原型對象,每個建構函式實例都包含一個指向原型對象的內部指標(proto),如果我們讓第一個建構子的原型物件等於第二個建構函式的實例,結果第一個建構函式的原型物件將包含一個指向第二個原型物件的指針,再然第三個原型物件等於第一個建構函式的實例,這樣第三個原型物件也將包含指向第一個原型物件的指針,以此類推,就夠成了實例於原型的鏈條,這就是原型鏈的基本概念

function One(){
 }
 function Two(){
 }
 function Three(){
 }
 Two.prototype=new One();
 Three.prototype=new Two();
 var three=new Three();
 console.log(three);
 console.log(three.__proto__===Three.prototype) //true
 console.log(three.__proto__.__proto__===Two.prototype) //true
 console.log(three.__proto__.__proto__.__proto__===One.prototype)  //true
 console.log(three.__proto__.__proto__.__proto__.__proto__===Object.prototype)  //true

#在物件實例中,存取物件原型的方法

1、使用proto屬性

此屬性是瀏覽器支援的屬性,並不是ECMAScript裡的屬性

2 .Object.getPrototypeOf

3.使用constructor.prototype的方法

對於不支援proto的瀏覽器,可以使用constructor,存取到物件的建構函數,在用prototype存取到原型

使用原型鏈解釋ANUGLAR作用域

在開發過程中,我們可能會出現控制器的嵌套,看下面這段程式碼:

  <div ng-controller="OuterCtrl">
        <span>{{a}}</span>
         <div ng-controller="InnerCtrl">
            <span>{{a}}</span>
         </div>
     </div>
    <script>
    function OuterCtrl($scope) {
    $scope.a = 1;
    }
    function InnerCtrl($scope) {
    }
    </script>

我們可以看到介面顯示了兩個1,而我們只在OuterCtrl的作用域裡定義了a變量,但介面給我們的結果是,兩個a都有值,現在自控制器裡的a是從父控制器裡繼承過來的

我們可以父子級的作用域看成兩個原型對象,其中一個原型對象繼承另一個原型對象的實例

以上是js中什麼是原型鏈的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn