美文网首页前端杂货随记
javascript继承之组合继承(三)

javascript继承之组合继承(三)

作者: 程序蜗牛 | 来源:发表于2018-02-04 19:42 被阅读0次

组合继承也叫伪经典继承,也就是组合了原型链和借用构造函数
实现思想:使用原型链实现对原型属性和方法的继承,通过借用构造函数实现对实例属性的继承,这样不仅可以在原型上定义方法,又能保证每个实例都有它自己的属性

  • 创建超类构造函数Car
function Car(master,color){
    this.master = master;
    this.color = color;
}
# 原型链方法
Car.prototype.changeColor = function(color){
    this.color = color;
}
  • 创建子类构造函数Audi
function Audi(master,color,year){
    Car.call(this,master,color);// 继承
    this.year = year;// 购买年份
}
  • 原型链继承以及构造函数指向设置(重点)
Audi.prototype = new Car();
Audi.prototype.constructor = Audi;// 设置原型的构造函数指向
  • 子类构造函数设置原型链方法
Audi.prototype.getMessage = function(){
    return this.master + "在" + this.year + "年买了一辆"+this.color+"的奥迪";
}
  • 实例继承测试
var car1 = new Audi("car1Master","黑色","2016");
var car2 = new Audi("car2Master","白色","2017");

console.log(car1.getMessage());
// 结果:car1Master在2016年买了一辆黑色的奥迪

console.log(car2.getMessage());
// 结果:car2Master在2017年买了一辆白色的奥迪

使用超类构造函数的方法

car1.changeColor("红色");
car2.changeColor("蓝色");

console.log(car1.getMessage());
// 结果:car1Master在2016年买了一辆红色的奥迪

console.log(car2.getMessage());
// 结果:car2Master在2017年买了一辆蓝色的奥迪

相关文章

  • javascript继承之组合继承(三)

    组合继承也叫伪经典继承,也就是组合了原型链和借用构造函数实现思想:使用原型链实现对原型属性和方法的继承,通过借用构...

  • javaScript 实现继承方式

    JavaScript实现继承共6种方式:原型链继承、借用构造函数继承、组合继承、原型式继承、寄生式继承、寄生组合式继承。

  • (九)

    寄生组合式继承前面说过,组合继承是JavaScript最常用的继承模式;不过,它也有自己的不足。组合继承最大的问题...

  • JavaScript的六种继承方式

    JavaScript的几种继承方式 原型链继承 借助构造函数继承(经典继承) 组合继承:原型链 + 借用构造函数(...

  • es5的部分继承以及es6的class

    一、JavaScript常用的原型继承方式 原型链继承 2,构造函数继承(对象冒充继承) 3,组合继承(原型链继承...

  • 【重学前端】JavaScript中的继承

    JavaScript中继承主要分为六种:类式继承(原型链继承)、构造函数继承、组合继承、原型式继承、寄生式继承、寄...

  • JavaScript 继承 3 组合继承

    组合继承,有时候也叫做伪经典继承,指的是将原型链和借用构造函数的技术组合到一起,从而发挥二者之长的一种继承模式。其...

  • Js 继承

    javaScript 继承,我们也许要有好多方式,比如说原型链继承,构造继承,实例继承、组合继承、但是我们必须要理...

  • JavaScript组合继承

    组合继承(combination inheritance),有时候也叫做伪经典继承,指的是将原型链和借用构造函数的...

  • 继承之组合继承

    组合原型链和借用构造函数 设计思想:1.使用原型链实现对原型属性和方法的继承:Man3.prototype = n...

网友评论

    本文标题:javascript继承之组合继承(三)

    本文链接:https://www.haomeiwen.com/subject/ylfvzxtx.html