JS继承 -- 寄生式继承 & 寄生组合式继承

5.寄生式继承

与寄生构造函数和工厂模式类似,创建一个仅用于封装继承过程的函数,该函数在内部以某种方式来增强对象,最后返回对象。

function createAnother(original){
    var clone = Object.create(original);    //通过调用函数创建一个新对象
    clone.sayHi = function(){               //以某种方式来增强这个对象
        alert("Hi");
    };

    return clone;                        //返回这个对象
}

var person = {
    name: "Bob",
    friends: ["Shelby", "Court", "Van"]
};
var anotherPerson = createAnother(person);
anotherPerson.sayHi();

在上述例子中,createAnother函数接收了一个参数,也就是将要作为新对象基础的对象。

anotherPerson是基于person创建的一个新对象,新对象不仅具有person的所有属性和方法,还有自己的sayHi()方法。

6.寄生组合式继承

  组合继承是js最常用的继承模式,组合继承最大的问题就是无论在什么情况下,都会调用两次构造函数:一次是在创建子类型原型时,另一次是在子类型构造函数内部。

function SuperType(name){
    this.name = name;
    this.colors = ["red", "blue", "green"];
}
SuperType.prototype.sayName = function(){
    alert(this.name);
}

function SubType(name, age){
    SuperType.call(this, name);  //第二次调用SuperType()

    this.age = age;
}
SubType.prototype = new SuperType();  //第一次调用SuperType()
SubType.prototype.sayAge = function(){
    alert(this.age);
}

在第一次调用SuperType构造函数时,SubType.prototype会得到两个属性: name和colors; 他们都是SuperType的实例属性,只不过现在位于SubType的原型中。

当调用SubType构造函数时,又会调用一次SuperType构造函数,这一次又在新对象上创建了实例属性name和colors。

于是这两个属性就屏蔽了原型中的两个同名属性。

寄生组合式继承就是为了解决这一问题。

通过借用构造函数来继承属性;

通过原型链来继承方法。

不必为了指定子类型的原型而调用超类型的构造函数,

function inheritPrototype(subType, superType){
    var protoType = Object.create(superType.prototype);    //创建对象
    protoType.constructor = subType;                    //增强对象
    subType.prototype = protoType;                        //指定对象
}
function SuperType(name){
    this.name = name;
    this.colors = ["red", "blue", "green"];
}
SuperType.prototype.sayName = function(){
    alert(this.name);
}

function SubType(name, age){
    SuperType.call(this, name);  //第二次调用SuperType()

    this.age = age;
}
inheritPrototype(SubType, SuperType)
SubType.prototype.sayAge = function(){
    alert(this.age);
}

var instance = new SubType("Bob", 18);
instance.sayName();
instance.sayAge();
inheritPrototype函数接收两个参数:子类型构造函数和超类型构造函数。1. 创建超类型原型的副本。2. 为创建的副本添加constructor属性,弥补因重写原型而失去的默认的constructor属性3. 将新创建的对象(即副本)赋值给子类型的原型这种方法只调用了一次SuperType构造函数,instanceof 和isPrototypeOf()也能正常使用。
时间: 2024-10-08 00:13:35

JS继承 -- 寄生式继承 & 寄生组合式继承的相关文章

JavaScript中的继承之寄生式继承

寄生式(parasitic)继承是与原型式继承紧密相关的一种思路. 寄生式继承的思路与寄生构造函数和工厂模式类似(这里提到的寄生构造函数和工厂模式都是创建对象的方法,有时间会写博客),即创建一个仅用于封装继承过程的函数,该函数在内部以某种方式来增强对象.最后再像真的是它做了所有工作一样返回对象. 还是要用之前的object函数: function object(o){ function F(){} F.prototype = o; return new F(); } 以下代码示范了寄生式继承.

JavaScript继承基础讲解,原型链、借用构造函数、混合模式、原型式继承、寄生式继承、寄生组合式继承

说好的讲解JavaScript继承,可是迟迟到现在讲解.废话不多说,直接进入正题. 既然你想了解继承,证明你对JavaScript面向对象已经有一定的了解,如还有什么不理解的可以参考<面向对象JS基础讲解,工厂模式.构造函数模式.原型模式.混合模式.动态原型模式>,接下来讲一般通过那些方法完成JavaScript的继承. 原型链 JavaScript中实现继承最简单的方式就是使用原型链,将子类型的原型指向父类型的实例即可,即“子类型.prototype = new 父类型();”,实现方法如下

[js高手之路]寄生组合式继承的优势

在之前javascript面向对象系列的文章里面,我们已经探讨了组合继承和寄生继承,回顾下组合继承: 1 function Person( uName ){ 2 this.skills = [ 'php', 'javascript' ]; 3 this.userName = uName; 4 } 5 Person.prototype.showUserName = function(){ 6 return this.userName; 7 } 8 function Teacher ( uName

JavaScript之原型式继承&amp;寄生式继承和寄生组合式继承以及优缺点

一.原型式继承 1.这种方法并没有使用严格意义上的构造函数,借助原型可以基于已有的对象创建新的对象 function object(o) { function F() {} F.prototype = o; return new F(); } // 在object()函数内部,先创建一个临时性的构造函数,然后将传入的对象作为这个构造函数原型,最后返回了这个临时类型的一个新实例. // object()本质上对其中传入的对象进行了一次浅复制 // 看如下的例子: var person = { na

[js高手之路]原型式继承与寄生式继承

一.原型式继承本质其实就是个浅拷贝,以一个对象为模板复制出新的对象 1 function object( o ){ 2 var G = function(){}; 3 G.prototype = o; 4 return new G(); 5 } 6 var obj = { 7 name : 'ghostwu', 8 age : 22, 9 show : function(){ 10 return this.name + ',' + this.age; 11 } 12 }; 13 var obj2

通过寄生组合式继承创建js的异常类

最近项目中在做js的统一的异常处理,需要自定义异常类.理想的设计方案为:自定义一个异常错误类BaseError,继承自Error,然后再自定义若干个系统异常,例如用户取消异常.表单异常.网络异常,继承自BaseError.系统中,根据各个自定义异常做统一的异常处理,例如如果是用户发出取消操作指令,当前调用链则抛出一个用户取消异常,然后由统一异常处理捕获,先判断他是不是继承自BaseError,如果是则再根据事先定义好的处理方案处理. 为啥说这只是理想的设计方案呢?因为es5根本就没有提供js的继

js继承之四(寄生组合式继承)

组合式继承尽管很优秀,但是还是有一个地方算完美调用父类构造函数调用了两次也就是实例化了两个父类对象 从这个结果可以发现,父类实例中的属性和方法其实子类已经有了,再添加进来未免多此一举:所以这就是优化的点 function CarModel(c){ this.color=c||"白色"; this.arr=[1,2,3]; this.getColor=function(){ console.log('我的颜色是'+this.color); } } CarModel.prototype.t

我理解的寄生组合式继承

寄生组合式继承,即通过借用构造函数来继承属性,通过原型链的混成形式来继承方法.其背后的基本思路是:不必为了指定子类型的原型而调用超类型的构造函数,我们所需要的无非就是超类型 原型的一个副本而已.本质上,就是使用寄生式继承来继承超类型的原型,然后再将结果指定给子类型 的原型. 代码如下: function inheritPrototype(subType, superType){ var prototype = object(superType.prototype); //创建super副本 pr

javaScript设计模式之面向对象编程(object-oriented programming,OOP)--寄生组合式继承

组合式继承:将类式继承同构造函数继承组合使用,但是存在一个问题,子类不是父类的实例,而子类的原型式父类的实例,所以才有了寄生组合式继承. 意思就是说,寄生就是寄生式继承,寄生式继承就是依托于原型继承,原型继承又与类式继承差不多,所以另外一种继承模式应该是构造函数继承.当然子类不是父类的实例的问题是由于类式继承引起的. 说道这,我不得不说一下,道格拉斯大哥对寄生式继承的改造 function inheritPrototype(subClass,superClass){ //复制一份父类的原型副本保