茄子在线看片免费人成视频,午夜福利精品a在线观看,国产高清自产拍在线观看,久久综合久久狠狠综合

    <s id="ddbnn"></s>
  • <sub id="ddbnn"><ol id="ddbnn"></ol></sub>

  • <legend id="ddbnn"></legend><s id="ddbnn"></s>

    javascript的幾種繼承方法介紹
    來源:易賢網(wǎng) 閱讀:1076 次 日期:2016-07-19 13:57:57
    溫馨提示:易賢網(wǎng)小編為您整理了“javascript的幾種繼承方法介紹”,方便廣大網(wǎng)友查閱!

    下面小編就為大家?guī)硪黄猨avascript的幾種繼承方法介紹。小編覺得挺不錯的?,F(xiàn)在分享給大家,給大家一個參考

    1.原型鏈繼承:構(gòu)造函數(shù)、原型和實例的關(guān)系:每個構(gòu)造函數(shù)都有一個原型對象,原型對象都包含一個指向構(gòu)造函數(shù)的指針,而實例都包含一個指向原型對象的內(nèi)部指針。確認原型和實例之間的關(guān)系用instanceof。

    原型鏈繼承缺點:字面量重寫原型會中斷關(guān)系,使用引用類型的原型,并且子類型還無法給超類型傳遞參數(shù)

    function Parent(){

        this.name='mike';

      }

      function Child(){

        this.age=12;

      }

      //兒子繼承父親(原型鏈)

      Child.prototype=new Parent();//Child繼承Parent,通過原型形成鏈條

      var test=new Child();

      console.log(test.age);

      console.log(test.name);//得到被繼承的屬性

      //孫子繼續(xù)原型鏈繼承兒子

      function Brother(){

        this.weight=60;

      }

      Brother.prototype=new Child();//繼承原型鏈繼承

      var brother=new Brother();

      console.log(brother.name);//繼承了Parent和Child,彈出mike

      console.log(brother.age);//12

      console.log(brother instanceof Child);//ture

      console.log(brother instanceof Parent);//ture

      console.log(brother instanceof Object);//ture

    2.構(gòu)造函數(shù)實現(xiàn)繼承:又叫偽造對象或經(jīng)典繼承。

    構(gòu)造函數(shù)實現(xiàn)繼承缺點:借用構(gòu)造函數(shù)雖然解決了原型鏈繼承的兩種問題,但沒有原型,則復(fù)用無從談起,所以需要原型鏈+借用構(gòu)造函數(shù)模式。

    function Parent(age){

        this.name=['mike','jack','smith'];

        this.age=age;

      }

      function Child(age){

        Parent.call(this,age);//把this指向Parent,同時還可以傳遞參數(shù)

      }

      var test=new Child(21);

      console.log(test.age);//21

      console.log(test.name);

      test.name.push('bill');

      console.log(test.name);//mike,jack,smith,bill

    3.組合繼承:使用原型鏈實現(xiàn)對原型屬性和方法的繼承,而通過借用構(gòu)造函數(shù)來實現(xiàn)對實例屬性的繼承。這樣即通過在原型上定義方法實現(xiàn)了函數(shù)復(fù)用,又保證每個實現(xiàn)都有它自己的屬性。

    缺點:無論什么情況下,都會調(diào)用兩次超類型構(gòu)造函數(shù),一次是在創(chuàng)建子類型原型的時候,另一次是在創(chuàng)建子類型原型的時候,另一次是在子類型構(gòu)造函數(shù)內(nèi)部。

    function Parent(age){

        this.name=['mike','jack','smith'];

        this.age=age;

      }

      Parent.prototype.run=function(){

        return this.name+' are both '+this.age;

      }

      function Child(age){

        Parent.call(this,age);//給超類型傳參,第二次調(diào)用

      }

      Child.prototype=new Parent();//原型鏈繼承,第一次調(diào)用

      var test1=new Child(21);//寫new Parent(21)也行

      console.log(test1.run());//mike,jack,smith are both 21

      var test2=new Child(22);

      console.log(test2.age);

      console.log(test1.age);

      console.log(test2.run());

      //這樣可以使test1和test2分別擁有自己的屬性age同時又可以有run方法

    4.原型式繼承:借助原型可以基于已有的對象創(chuàng)建新對象,同時還不必因此創(chuàng)建自定義類型。它要求必須有一個對象可以作為另一個對象的基礎(chǔ)。

    function object(o){

        function F(){};

        F.prototype=o;

        return new F();

      }

      var person={

        name:'nicho',

        friends:['shell','jim','lucy']

      }

      var anotherPerson = object(person);

      anotherPerson.name = 'Greg';

      anotherPerson.friends.push('Rob');

      console.log(anotherPerson.friends);//["shell", "jim", "lucy", "Rob"]

      var yetAnotherPerson = object(person);

      yetAnotherPerson.name = 'Linda';

      yetAnotherPerson.friends.push('Barbie');

      console.log(yetAnotherPerson.friends);//["shell", "jim", "lucy", "Rob", "Barbie"]

      console.log(person.friends);//["shell", "jim", "lucy", "Rob", "Barbie"]

    ECMAScript5通過新增Object.create()方法規(guī)范化了原型式繼承,這個方法接收兩個參數(shù):一個用作新對象原型的對象和(可選的)一個為新對象定義屬性的對象。

    var person2={

        name:'nicho',

        friends:['shell','jim','lucy']

      };

      var anoP2=Object.create(person2);

      anoP2.name="Greg";

      anoP2.friends.push('Rob');

      console.log(anoP2.friends);//["shell", "jim", "lucy", "Rob"]

      var yetP2=Object.create(person2);

      yetP2.name="Linda";

      yetP2.friends.push('Barbie');

      console.log(yetP2.friends);//["shell", "jim", "lucy", "Rob", "Barbie"]

      console.log(person2.friends);//["shell", "jim", "lucy", "Rob", "Barbie"]

      /*以這種方式指定的任何屬性都會覆蓋原型對象上的同名屬性。*/

      var threeP=Object.create(person,{

        name:{value:'red'}

      });

      console.log(threeP.name);//red,如果threeP中無name則輸出person2里的name值nicho

    5.寄生式繼承:思路與寄生構(gòu)造函數(shù)和工廠模式類似,即創(chuàng)建一個僅用于封裝繼承過程的函數(shù),該函數(shù)在內(nèi)部以某種方式來增強對象,最后再像真地是它做了所有工作一樣返回對象。

    function object(o){

        function F(){};

        F.prototype=o;

        return new F();

      };

      function createAnother(o){

        var cl=object(o);

        cl.sayHi=function(){

          console.log('hi');

        }

        return cl;

      };

      var person={

        name:'nick',

        friends:['shelby','court','van']

      }

      var anotherPerson=createAnother(person);

      anotherPerson.sayHi();//hi

      console.log(anotherPerson.name);//nick

      console.log(anotherPerson.friends);//["shelby", "court", "van"]

      /*這個例子中的代碼基于 person 返回了一個新對象—— anotherPerson 。 新對象不僅具有 person

       的所有屬性和方法,而且還有自己的 sayHi() 方法*/

    寄生組合式繼承:無論什么情況下,都會調(diào)用兩次超類型構(gòu)造函數(shù),一次是在創(chuàng)建子類型原型的時候,另一次是在創(chuàng)建子類型原型的時候,另一次是在子類型構(gòu)造函數(shù)內(nèi)部,這樣子類型最終會包含超類型對象的全部實例屬性,我們不得不在調(diào)用子類型構(gòu)造函數(shù)時重寫這些屬性。因此出現(xiàn)了寄生組合式繼承。

    6.寄生組合式繼承:借用構(gòu)造函數(shù)來繼承屬性,通過原型鏈的混成形式來繼承方法?;舅悸罚翰槐貫榱酥付ㄗ宇愋偷脑投{(diào)用超類型的構(gòu)造函數(shù)。本質(zhì)上就是使用寄生式繼承來繼承超類型的原型,然后再將結(jié)果指定給子類型的原型。

    function SuperType(name){

        this.name=name;

        this.colors=['red','blue','green'];

      }

      SuperType.prototype.sayName=function(){

        console.log(this.name);

      }

      function SubType(name,age){

        SuperType.call(this,name);

        this.age=age;

      }

      function object(o){

        function F(){};

        F.prototype=o;

        return new F();

      };

      /*inheritPrototype此函數(shù)第一步是創(chuàng)建超類型原型的一個副本。第二步是為創(chuàng)建的副本添加constructor屬性,

      * 從而彌補因重寫原型而失去的默認的constructor屬性,第三步將新創(chuàng)建的對象(副本)賦值給子類型的原型*/

      function inheritPrototype(subType,superType){

        var prototype=object(superType.prototype);//創(chuàng)建對象

        prototype.constructor=subType;//增強對象

        subType.prototype=prototype;//指定對象

      }

      inheritPrototype(SubType,SuperType);

      SubType.prototype.sayAge=function(){

        console.log(this.age);

      }

      var p=new SubType('xiaoli',24);

      console.log(p.sayName());

      console.log(p.sayAge());

      console.log(p.colors)

    此方法優(yōu)點:只調(diào)用了一次父類SuperType構(gòu)造函數(shù),并且因此避免了在SubType.prototype上面創(chuàng)建不必要的多余的屬性。同時原型鏈還能保持不變,還能正常使用instanceof和isPrototypeOf();

    以上這篇javascript的幾種繼承方法介紹就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考

    更多信息請查看網(wǎng)絡(luò)編程
    易賢網(wǎng)手機網(wǎng)站地址:javascript的幾種繼承方法介紹

    2026上岸·考公考編培訓(xùn)報班

    • 報班類型
    • 姓名
    • 手機號
    • 驗證碼
    關(guān)于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡要咨詢 | 簡要咨詢須知 | 新媒體/短視頻平臺 | 手機站點 | 投訴建議
    工業(yè)和信息化部備案號:滇ICP備2023014141號-1 云南省教育廳備案號:云教ICP備0901021 滇公網(wǎng)安備53010202001879號 人力資源服務(wù)許可證:(云)人服證字(2023)第0102001523號
    聯(lián)系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關(guān)注公眾號:hfpxwx
    咨詢QQ:1093837350(9:00—18:00)版權(quán)所有:易賢網(wǎng)