1. 程式人生 > >JavaScript學習筆記——原型、原型鏈、call/apply—day five

JavaScript學習筆記——原型、原型鏈、call/apply—day five

目錄

原型

定義

原型的增刪改查

物件如何檢視物件的建構函式

物件如何檢視原型

原型鏈

如何構成原型鏈

Object.create(原型) 

call/apply


原型

定義

原型是function物件的一個屬性,它定義了建構函式製造出的物件的公共祖先。通過該構造方法產生的物件,可以繼承該原型的屬性和方法。原型也是物件。

利用原型的特點和概念可以提前共有屬性。

原型的增刪改查

         Person.prototype.LastName='Deng';
        // Person.prototype={}   原型,是祖先,也是個物件
        // 多個屬性可簡寫如下
        Person.prototype={
            height:1200,
            with:134
        }
        function Person(color){
            this.color=color;
            this.name='miss';
            this.height=180;
        }
        var person1 = new Person('red');
        //  增
        Person.prototype.class='隨便';
        //  刪  可以刪除物件裡的屬性,但是再查詢的時候還是有LastName
        delete Person.LastName;
        //  改
        Person.prototype.LastName='Li';
        // 查
        console.log(person1.LastName);

物件如何檢視物件的建構函式

constructor,系統給出,可以手動修改指向的函式。

物件如何檢視原型

隱式屬性:_proto_  可以手動修改,不一定是指向Person.prototype,通過Person._proto_=obj;指向另一個物件。相當於換了個原型,與原來的原型沒有任何關係。

原型鏈

如何構成原型鏈

子物件的原型是父物件,屬性會繼承,依次查詢最近祖先物件的屬性。後代無法刪除修改父代的屬性。

       Grand.prototype.lastname = 'wang';
        function Grand() {

        }
        var grand = new Grand();
        Father.prototype = grand;
        function Father() {
            this.name = 'xiaowang';
            this.fortune={
                card1:'visa'
            };
            // 也是一個屬性,有多個屬性值
            num=100;
        }
        var farther = new Father();
        Son.prototype = farther;
        function Son() {
            this.hobbit = 'smoke';
        }
        var son = new Son();
        // 子元素依舊沒有fortune屬性,只是相當於通過一個關係,呼叫fortune屬性,併為它增加屬性
        // 這相當於一直呼叫的修改,前面說的子元素修改父元素屬性是一種賦值的修改不行
        son.fortune.card2='master';
        son.num++;
        // son.num=101;father.num=100;

Object.create(原型) 

 絕大多數物件最終都會繼承自Object.prototype,括號裡面為null,建立的物件就沒原型,但是有object物件。

       var obj={name:123,class:'big'};
        var obj1=Object.create(obj);

call/apply

作用:改變This指向,(利用別人的方法,實現自己的功能)全部this都會傳進來,所以用的時候必須保證屬性全覆蓋。

區別:後面傳的引數形式不同

call需要把實參按照實參的個數傳進去

apply需要傳一個arguments(陣列),直接在call的實參列表加上中括號就行。

      function Head(size,form){
            this.size=size;
            this.form=form;
        }
        function Hair(len,color,num){
            this.len=len;
            this.color=color;
            this.num=num;
        }
        function Person(size,form,len,color,num){
            Head.call(this,size,form);
            Hair.apply(this,[len,color,num]);
        }
        var person=new Person('big','cobe',50,'black','more');