JavaScript如何借用构造函数继承
这篇文章主要介绍了JavaScript如何借用构造函数继承,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
借用构造函数继承是在子类型构造函数的内部调用超类型构造函数,通过使用apply()和call()方法
function girlFriend(){ this.girls = ['chen','wang','zhu']; } function Person(){ girlFriend.call(this,20); } var wang = new Person(); var zhu = new Person(); wang.girls.push('zhang'); console.log(wang.girls); //(4) ["chen", "wang", "zhu", "zhang"] console.log(zhu.girls); //(3) ["chen", "wang", "zhu"]
通过以上代码,我们可以发现,在原型链继承中出现的问题不再出现了,这个超类不会被子类所创建的实例共享了。
借用构造函数继承的优势是可以在子类型构造函数中向超类型构造函数传递参数,例如以下代码:
function SuperType(name){ this.name = name; } function SubType(){ SuperType.call(this,"nick"); this.age = 20; } var instance = new SubType(); console.log(instance.name); //nick console.log(instance.age); //20
借用构造函数继承的问题:用构造函数继承并不能继承到超类型原型中定义的方法,例如以下代码,在girlFriends构造函数的原型中添加sayHello方法:
girlFriend.prototype.sayHello = function(){ console.log('hello'); }
继承它的子类构造函数的实例并不能调用到这个sayHello方法,返回的值是undefined
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
相关文章
漂亮的widgets,支持换肤和后期开发新皮肤(2007-4-27已更新1.7alpha)
漂亮的widgets,支持换肤和后期开发新皮肤(2007-4-27已更新1.7alpha)...2007-04-04解决layui前端框架 form表单,table表等内置控件不显示的问题
今天小编就为大家分享一篇解决layui前端框架 form表单,table表等内置控件不显示的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧2018-08-08javascript实现dom动态创建省市纵向列表菜单的方法
这篇文章主要介绍了javascript实现dom动态创建省市纵向列表菜单的方法,可实现省市列表菜单效果,涉及javascript鼠标事件及页面处理json数据的技巧,需要的朋友可以参考下2015-05-05Bootstrap~多级导航(级联导航)的实现效果【附代码】
下面小编就为大家分享一篇Bootstrap~多级导航(级联导航)的实现效果【附代码】。小编觉得挺不错。希望对大家有所帮助。一起跟随小编过来看看吧2016-03-03
最新评论