美文网首页
(3)JavaScript继承模式一

(3)JavaScript继承模式一

作者: jaimor | 来源:发表于2019-04-19 09:10 被阅读0次

继承可以使得子类具有父类的属性和方法或者重新定义、追加属性和方法等。继承可以高效利用之前封装过的类,而不影响之前的类的属性、功能。继承也是对被继承类的拓展,使其具有更多功能,下边简单写写我的理解。

//父类
function Supper(msg) {
  this.msg = msg;
  this.supperVal = "supperVal";
}
Supper.prototype.say = function () {
  console.log(this.msg);
}
Supper.prototype.getSupperVal = function () {
  return this.supperVal;
}
new Supper("i am supper").say();    // i am supper

//子类
function Sub(msg) {
  this.name = "sub";            //对父类的拓展,父类没有,而子类有的属性
  this.msg = msg;               //覆盖、修改父类的属性
}
Sub.prototype = new Supper("supper class");  //这里只是修改了父类的msg
//拓展了一个新的方法、功能
Sub.prototype.who = function () {
    console.log(this.name);
}
var sub = new Sub("i am sub");    //子类msg为 i am sub
sub.who();      // sub,这里是对父类的属性、方法进行的拓展
sub.say();      // i am sub,这里是对父类的属性进行覆盖
sub.getSupperVal();    //supperVal,这里是对父类的属性进行继承
对象结构
这样做,子类就继承了父类的全部属性,并且还新增了一个属性name,覆盖了父类的msg属性,而且也新增了一个方法who。当子类调用say()方法,输出i am sub而不是supper class,这个和js原型链、this有关了,这里不做讨论。
这里其实有一点瑕疵,如果suuperVal使用引用模式的话就会出现,下一篇文章继承模式二做讨论。

相关文章

  • (3)JavaScript继承模式一

    继承可以使得子类具有父类的属性和方法或者重新定义、追加属性和方法等。继承可以高效利用之前封装过的类,而不影响之前的...

  • JavaScript继承模式

    1,原型链继承 步骤定义父类型构造函数给父类型的原型添加方法定义子类型的构造函数创建父类型的对象赋值给子类型的原型...

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

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

  • javascript----继承模式

    我是谁,我来自哪,我是谁的谁 想必大家一定在学习或者开发过程常常被JS独有的原型继承拨过不少脑弦吧,为何不迎问题而...

  • (九)

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

  • JavaScript 继承 3 组合继承

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

  • 大前端目录

    html css3 javascript ECMAScript 5原型链、继承、多重继承 ECMAScript 6...

  • 关于观察者, 发布订阅,中介者的一些学习体会2019-07-05

    w3cSchool javascript 观察者模式w3cSchool javascript 中介者模式 1. 顺...

  • JavaScript继承详解(Mixin)

    上一篇JavaScript继承详解(Klass)介绍了各种继承的模式。但究竟为何要继承?一个很重要的目的就是为了代...

  • Javascript 继承

    参考:JavaScript高级程序设计(第3版) 原型链 原型式继承 寄生式继承 寄生组合式继承

网友评论

      本文标题:(3)JavaScript继承模式一

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