js寄生組合式繼承使用詳解

這次帶給大家js寄生組合式繼承使用詳解，js寄生組合式繼承使用的注意事項有哪些，下面就是實戰案例，一起來看一下。

組合繼承：

function Person( uName ){
      this.skills = [ 'php', 'javascript' ];
      this.userName = uName;
    }
    Person.prototype.showUserName = function(){
      return this.userName;
    }
    function Teacher ( uName ){
      Person.call( this, uName );
    }
    Teacher.prototype = new Person();
    var oT1 = new Teacher( 'ghostwu' );
    oT1.skills.push( 'linux' );
    var oT2 = new Teacher( 'ghostwu' );
    console.log( oT2.skills ); //php,javascript
    console.log( oT2.showUserName() ); //ghostwu

組合繼承有個缺點，父類別的建構子會被呼叫兩次.

第11行，設定子類別原型物件(prototype)，呼叫了第一次

# 第9行，實例化物件的時候，又呼叫一次

建構函數的目的是為了複製屬性，第9行肯定是不能少的，第11行的目的是為了取得到父類原型物件(prototype)上的方法，基於這個目的，有沒有別的方法

可以做到 在不需要實例化父類別建構子的情況下，也能得到父類別原型物件上的方法呢？當然可以，我們可以採用寄生式繼承來得到父類別原型物件上的方法

function Person( uName ){
      this.skills = [ 'php', 'javascript' ];
      this.userName = uName;
    }
    Person.prototype.showUserName = function(){
      return this.userName;
    }
    function Teacher ( uName ){
      Person.call( this, uName );
    }
    function object( o ){
      var G = function(){};
      G.prototype = o;
      return new G();
    }
    function inheritPrototype( subObj, superObj ){
      var proObj = object( superObj.prototype ); //复制父类superObj的原型对象
      proObj.constructor = subObj; //constructor指向子类构造函数
      subObj.prototype = proObj; //再把这个对象给子类的原型对象
    }
    inheritPrototype( Teacher, Person );
    var oT1 = new Teacher( 'ghostwu' );
    oT1.skills.push( 'linux' );
    var oT2 = new Teacher( 'ghostwu' );
    console.log( oT2.skills ); //php,javascript
    console.log( oT2.showUserName() ); //ghostwu

其實，說白了寄生組合式繼承就是一個借用構造函數相當於淺拷貝父類的原型對象

相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

推薦閱讀：

#

以上是js寄生組合式繼承使用詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！