JavaScript原型鏈

flym_發表於2017-12-19

1.什麼是原型鏈?

每個建構函式都有原型物件;每個物件都會有建構函式;每個建構函式的原型都是一個物件;那麼這個原型物件也會有建構函式;那麼這個原型物件的建構函式也會有原型物件;這樣就會形成一個鏈式的結構,稱為原型鏈。

2.原型鏈結構的基本形式

 function Person(name){
            this.name = name;
        }

        var p = new Person();

        //p ---> Person.prototype --->Object.prototype---->null
複製程式碼

3.屬性搜尋原則:

a.當訪問一個物件的成員的時候,會現在自身找有沒有,如果找到直接使用, b.如果沒有找到,則去當前物件的原型物件中去查詢,如果找到了直接使用, c.如果沒有找到,繼續找原型物件的原型物件,如果找到了,直接使用 d.如果沒有找到,則繼續向上查詢,直到Object.prototype,如果還是沒有,就報錯

4.原型繼承概念

通過修改原型鏈結構實現的繼承,就叫做原型繼承。

5.複雜的原型鏈

//動物--->人---->老師---->壞老師

        function Animal(){
            this.gender = "male";
        }

        Human.prototype = new Animal();
        Human.prototype.constructor = Human;
        function Human(){
            this.actionWay = "走路";
        }

        Teacher.prototype = new Human();
        Teacher.prototype.constructor = Teacher;
        function Teacher(){
            this.skill = "教書";
        }

        BadTeacher.prototype = new Teacher();
        BadTeacher.prototype.constructor = BadTeacher;
        function BadTeacher(){
            this.name = "呂超";
        }

        var t = new BadTeacher();
        console.log(t);
複製程式碼

6.Object.prototype的成員

①.constructor: 原型物件內的一個屬性,指向該原型物件相關聯的建構函式。 ②.hasOwnProperty: 一個方法,用來判斷物件本身(不包含原型)是否擁有某個屬性。

function Person(){
          this.name = "王九"
    }
      Person.prototype.name = "張三";

       var p = new Person();
      console.log(p.name);

       console.log(p.hasOwnProperty("__proto__"));
複製程式碼

③.propertyIsEnumerable: a. 判斷屬性是否屬於物件本身 b. 判斷屬性是否可以被遍歷

 console.log(p.propertyIsEnumerable("name"));
複製程式碼

④.將物件轉換成字串

var o = {};
       console.log(o.toString());
       console.log(o.toLocaleString());

      var now = new Date();
      console.log(now.toString());
      console.log(now.toLocaleString());
複製程式碼

⑤.valueOf: 獲取當前物件的值

       function Person(){

           }
       var p = new Person();

        //在物件參與運算的時候
        //1.預設的會先去呼叫物件的valueOf方法,
        //2.如果valueOf獲取到的值,無法進行運算 ,就去去呼叫p的toString方法  最終做的就是字串拼接的工作
        console.log( 1 + p);
複製程式碼

⑥ _proto_: a.原型物件物件中的屬性 b.可以使用 物件.__proto__去訪問原型物件

相關文章