资讯专栏INFORMATION COLUMN

JavaScript面向对象编程-继承(三)

alaege / 3043人阅读

摘要:子类不是父类实例的问题是由类式继承引起的。所以寄生式继承和构造函数继承的组合又称为一种新的继承方式。但是这里的寄生式继承处理的不是对象,而是类的原型。看上去略微复杂,还得好好研究。

寄生组合式继承(终极继承者)

前面学习了类式继承和构造函数继承组合使用,也就是组合继承,但是这种继承方式有个问题,就是子类不是父类的实例,而子类的原型是父类的实例。子类不是父类实例的问题是由类式继承引起的。因此还有一种更好的继承方式,那就是寄生组合式继承,也就是寄生式继承和构造函数继承的组合,因为寄生式继承依托于原型继承,原型继承又与类式继承相像。所以寄生式继承和构造函数继承的组合又称为一种新的继承方式。但是这里的寄生式继承处理的不是对象,而是类的原型。

/**
 *寄生式继承 继承原型
 * 传递参数 subClass子类
 * 传递参数 superClass 父类
 */
function inheritPrototype(subClass,superClass) {
    //复制一份父类的原型副本保存在变量中
    var p = inheritObject(superClass.prototype);
    //修正因为重写子类原型副本保存在变量中
    p.constructor = subClass;
    //设置子类的原型
    subClass.prototype = p;
}
//测试代码
//定义父类
function SuperClass(name) {
    this.name = name;
    this.colors =["red","blue","green"];
}
//定义父类原型方法
SuperClass.prototype.getName = function () {
    console.log(this.name);
};
//定义子类
function SubClass(name,time) {
    //构造函数式继承
    SuperClass.call(this,name);
    //子类新增属性
    this.time = time;
}
//寄生式继承父类原型
inheritPrototype(SubClass,SuperClass);
//子类新增原型方法
SubClass.prototype.getTime = function () {
    console.log(this.time);
};
//创建两个测试方法
var instance1 = new SubClass("js",2018);
var instance2 = new SubClass("css",8102);
instance1.colors.push("black");
console.log(instance1.colors);//[ "red", "blue", "green", "black" ]
console.log(instance2.colors);//[ "red", "blue", "green" ]
instance2.getName();//css
instance2.getTime();//8102

寄生组合式继承主要是通过寄生式继承重新继承父类的原型,需要继承的仅仅是父类的原型,而不需要再调用父类的构造函数,也就是说在构造函数继承中我们已经调用了父类的构造函数,因此我们需要的就是父类的原型对象的一个副本,而这个副本通过原型继承即可得到,但是直接赋值给子类会有问题,因为对父类原型对象复制得到的复制对象p中的constructor指向的不是subClass子类对象,因此在寄生式继承中要对复制对象p做一次增强,修复其constructor属性指向不正确的问题,最后将得到的复制对象p赋值给子类的原型,这样子类的原型就继承了父类的原型并且没有执行父类的构造函数。
看上去略微复杂,还得好好研究。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/97923.html

相关文章

  • Javascript面向对象编程):非构造函数的继承

    摘要:原文链接一什么是非构造函数的继承比如,现在有一个对象,叫做中国人。通过函数,继承了。中国北京上海香港厦门北京上海香港厦门北京上海香港这时,父对象就不会受到影响了。目前,库使用的就是这种继承方法。 原文链接 一、什么是非构造函数的继承? 比如,现在有一个对象,叫做中国人。 var Chinese = { nation: 中国 } 还有一个对象,叫做医生。 var Doctor = {...

    jaysun 评论0 收藏0
  • SegmentFault 技术周刊 Vol.32 - 七夕将至,你的“对象”还好吗?

    摘要:很多情况下,通常一个人类,即创建了一个具体的对象。对象就是数据,对象本身不包含方法。类是相似对象的描述,称为类的定义,是该类对象的蓝图或原型。在中,对象通过对类的实体化形成的对象。一类的对象抽取出来。注意中,对象一定是通过类的实例化来的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 马上就要到七夕了,离年底老妈老爸...

    李昌杰 评论0 收藏0
  • SegmentFault 技术周刊 Vol.32 - 七夕将至,你的“对象”还好吗?

    摘要:很多情况下,通常一个人类,即创建了一个具体的对象。对象就是数据,对象本身不包含方法。类是相似对象的描述,称为类的定义,是该类对象的蓝图或原型。在中,对象通过对类的实体化形成的对象。一类的对象抽取出来。注意中,对象一定是通过类的实例化来的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 马上就要到七夕了,离年底老妈老爸...

    Lyux 评论0 收藏0
  • SegmentFault 技术周刊 Vol.32 - 七夕将至,你的“对象”还好吗?

    摘要:很多情况下,通常一个人类,即创建了一个具体的对象。对象就是数据,对象本身不包含方法。类是相似对象的描述,称为类的定义,是该类对象的蓝图或原型。在中,对象通过对类的实体化形成的对象。一类的对象抽取出来。注意中,对象一定是通过类的实例化来的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 马上就要到七夕了,离年底老妈老爸...

    AaronYuan 评论0 收藏0
  • javaScript面向对象编程-继承(一)

    摘要:组合继承前面两种模式的特点类式继承通过子类的原型对父类实例化实现的,构造函数式继承是通过在子类的构造函数作用环境中执行一次父类的构造函数来实现的。 类有三部分 构造函数内的,供实例化对象复制用的 构造函数外的,直接通过点语法添加的,供类使用,实例化对象访问不到 类的原型中的,实例化对象可以通过其原型链间接地访问到,也是供所有实例化对象所共用的。 类式继承 类的原型对象的作用就是为类...

    YorkChen 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<