Javascript繼承6：終極繼承者----寄生組合式繼承

/*
* 寄生式繼承依託於原型繼承，原型繼承又與類式繼承想象。
* 即： 原型與構造函數的組合繼承
* 寄生式繼承  繼承原型
* 傳遞參數 childClass 子類
* 傳遞參數 parentClass 父類
*/

//原型式繼承
function inheritObj(obj){
    //聲明一個過渡函數對象
    function F(){}
    //過渡對象的原型繼承父對象
    F.prototype = obj;
    //返回過渡對象的一個實例，該實例的原型繼承了父對象
    return new F();
}

function inheritPrototype(childClass,parentClass){
    //複製一份父類原型副本保存在變量中
    var p = inheritObj(parentClass.prototype);
    //修正由於重寫子類原型致使子類的constructor屬性被修改
    p.constructor = childClass;
    //設置子類原型
    childClass.prototype = p;
}

// 定義父類
function ParentClass(name){
    this.name = name;
    this.books = ['Html'];
}
//定義父類原型方法
ParentClass.prototype.getName = function(){
    console.log(this.name);
}
//定義子類
function ChildClass(name,time){
    //構造函數是繼承
    ParentClass.call(this,name);
    //子類新增屬性
    this.time = time;
}

// 寄生式繼承父類原型
inheritPrototype(ChildClass,ParentClass);
//子類新增方法
ChildClass.prototype.getTime = function(){
    console.log(this.time);
}
// test
var child1 = new ChildClass('react',2018);
var child2 = new ChildClass('vue',2017);

child1.books.push('css');

console.log(child1.books)     // ['Html','css']
console.log(child2.books)     // ['html']

child2.getName()              // Vue
child2.getTime()              // 2017

設計模式中的經典筆錄