JavaScript类的继承方法小结【组合继承分析】


Posted in Javascript onJuly 11, 2018

本文实例讲述了JavaScript类的继承方法。分享给大家供大家参考,具体如下:

在JavaScript 里,被继承的函数称为超类型(父类,基类也行,其他语言叫法),继承的函数称为子类型(子类,派生类)。继承也有之前问题,比如字面量重写原型会中断关系,使用引用类型的原型,并且子类型还无法给超类型传递参数。

为了解决引用共享和超类型无法传参的问题,我们采用一种叫借用构造函数的技术,或者成为对象冒充(伪造对象、经典继承)的技术来解决这两种问题。

function aObj(){
  this.name = ['小红','小强'];
  }
}
aObj.prototype.showname = ()=>{
  alert(this.name)
}
function bObj(){
  aObj.call(this); //只针对构造函数本身的继承 还需要继承原型
}

借用构造函数虽然解决了函数本身的继承,但没有继承原型链。所以,我们需要原型链+借用构造函数的模式,这种模式称为组合继承。

方法一:

bObj.prototype = aObj.prototype;

缺点:引用类型,在操作对象原型时候,直接改变堆内存中对象的方法

方法二:

bObj.prototype = new aObj();

这种继承借助原型并基于已有的对象创建新对象,同时还不必因此创建自定义类型,但是构造函数两次继承,不是很好

方法三:

bObj.prototype = Object.create(aObj.prototype);
bObj.prototype.constructor = bObj

使用a原型对象及其属性去创建一个新的对象,并将这个对象的constructor指向B函数本身,不存在重复继承的问题

方法四:

for (var i in aObj.prototype) {
  bObj.prototype[i] = aObj.prototype[i];
}

将a的原型链遍历给b对象,实现原型的深度拷贝,双方互不影响

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript 异步页面查询实现代码(asp.net)
May 26 Javascript
有关于eclipse配置spket需要注意的一些地方
Apr 07 Javascript
javascript检查浏览器是否已经启用XX功能
Jul 10 Javascript
jQuery插件简单实现方法
Jul 18 Javascript
jQuery+PHP星级评分实现方法
Oct 02 Javascript
jQuery简单实现tab选项卡切换效果
Jun 20 Javascript
JavaScript中String对象的方法介绍
Jan 04 Javascript
vue项目优化之通过keep-alive数据缓存的方法
Dec 11 Javascript
vue实现点击隐藏与显示实例分享
Feb 13 Javascript
详解JavaScript原生封装ajax请求和Jquery中的ajax请求
Feb 14 jQuery
小程序点击图片实现png转jpg
Oct 22 Javascript
vant 解决tab切换插件标题样式自定义的问题
Nov 13 Javascript
React中嵌套组件与被嵌套组件的通信过程
Jul 11 #Javascript
JSON数据中存在单个转义字符“\”的处理方法
Jul 11 #Javascript
JS实现动态生成html table表格的方法分析
Jul 11 #Javascript
vue监听键盘事件的快捷方法【推荐】
Jul 11 #Javascript
vue移动端实现红包雨效果
Jun 23 #Javascript
vue实现学生录入系统之添加删除功能
Jul 11 #Javascript
微信小程序实现红包雨功能
Jul 11 #Javascript
You might like
PHP学习之PHP运算符
2006/10/09 PHP
使用PHP强制下载PDF文件示例
2014/01/17 PHP
PHP速成大法
2015/01/30 PHP
小程序微信退款功能实现方法详解【基于thinkPHP】
2019/05/05 PHP
javaScript array(数组)使用字符串作为数组下标的方法
2013/11/19 Javascript
javascript实现的一个带下拉框功能的文本框
2014/05/08 Javascript
jquery通过load获取文件的内容并跳到锚点的方法
2015/01/29 Javascript
轻松学习jQuery插件EasyUI EasyUI创建RSS Feed阅读器
2015/11/30 Javascript
由简入繁实现Jquery树状结构的方法(推荐)
2016/06/10 Javascript
浅谈js的url解析函数封装
2016/06/28 Javascript
基于JSON格式数据的简单jQuery幻灯片插件(jquery-slider)
2016/08/10 Javascript
JavaScript toUpperCase()方法使用详解
2016/08/26 Javascript
jquery mobile移动端幻灯片滑动切换效果
2020/04/15 Javascript
解决vue中对象属性改变视图不更新的问题
2018/02/23 Javascript
简述JS浏览器的三种弹窗
2018/07/15 Javascript
详解vue 数组和对象渲染问题
2018/09/21 Javascript
vue项目实现设置根据路由高亮对应的菜单项操作
2020/08/06 Javascript
vue实现表格合并功能
2020/12/01 Vue.js
机器学习10大经典算法详解
2017/12/07 Python
Python+matplotlib+numpy实现在不同平面的二维条形图
2018/01/02 Python
Python程序运行原理图文解析
2018/02/10 Python
Python的多维空数组赋值方法
2018/04/13 Python
解决python opencv无法显示图片的问题
2018/10/28 Python
基于Python的ModbusTCP客户端实现详解
2019/07/13 Python
Python将视频或者动态图gif逐帧保存为图片的方法
2019/09/10 Python
Python用input输入列表的实例代码
2020/02/07 Python
Python netmiko模块的使用
2020/02/14 Python
python为什么会环境变量设置不成功
2020/06/23 Python
毕业生多媒体设计求职信
2013/10/12 职场文书
心理健康教育心得体会
2013/12/29 职场文书
《三亚落日》教学反思
2014/04/26 职场文书
领导干部群众路线教育实践活动剖析材料
2014/10/10 职场文书
领导班子群众路线与四风问题对照检查材料思想汇报
2014/10/11 职场文书
运动员加油词
2015/07/18 职场文书
Nginx开启Brotli压缩算法实现过程详解
2021/03/31 Servers
python游戏开发Pygame框架
2022/04/22 Python