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编程起步(第三课)
Feb 27 Javascript
JavaScript Distilled 基础知识与函数
Apr 07 Javascript
jquery获取特定name所有选中的checkbox,支持IE9标准模式
Mar 18 Javascript
改变文件域的样式实现思路同时兼容ie、firefox
Oct 23 Javascript
JavaScript中使用Object.create()创建对象介绍
Dec 30 Javascript
JavaScript实现俄罗斯方块游戏过程分析及源码分享
Mar 23 Javascript
浅谈js里面的InttoStr和StrtoInt
Jun 14 Javascript
AngularJS应用开发思维之依赖注入3
Aug 19 Javascript
使用微信内嵌H5网页解决JS倒计时失效问题
Jan 13 Javascript
微信小程序新手教程之启动页的重要性
Mar 03 Javascript
详解json串反转义(消除反斜杠)
Aug 12 Javascript
微信小程序实现聊天室功能
Jun 14 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
解决file_get_contents无法请求https连接的方法
2013/12/17 PHP
php求数组全排列,元素所有组合的方法
2016/05/05 PHP
SAE实时日志接口SDK用法示例
2016/10/09 PHP
JS 自动安装exe程序
2008/11/30 Javascript
基于jQuery图片平滑连续滚动插件
2009/04/27 Javascript
在模板页面的js使用办法
2010/04/01 Javascript
使用 JavaScript 进行函数式编程 (一) 翻译
2015/10/02 Javascript
JavaScript的函数式编程基础指南
2016/03/19 Javascript
基于JS实现移动端向左滑动出现删除按钮功能
2017/02/22 Javascript
JavaScript调试之console.log调试的一个小技巧分享
2017/08/07 Javascript
AngularJS select加载数据选中默认值的方法
2018/02/28 Javascript
vue+element-ui动态生成多级表头的方法
2018/08/28 Javascript
vue 实现强制类型转换 数字类型转为字符串
2019/11/07 Javascript
[04:28]DOTA2亚洲邀请赛小组赛第五日 TOP10精彩集锦
2015/02/03 DOTA
[05:13]2018DOTA2亚洲邀请赛主赛事第二日战况回顾 LGD、VG双雄携手晋级
2018/04/05 DOTA
python实现根据窗口标题调用窗口的方法
2015/03/13 Python
详解pyqt5 动画在QThread线程中无法运行问题
2018/05/05 Python
使用TensorFlow实现二分类的方法示例
2019/02/05 Python
python实现爬山算法的思路详解
2019/04/09 Python
python面试题Python2.x和Python3.x的区别
2019/05/28 Python
python实现复制大量文件功能
2019/08/31 Python
python安装scipy的步骤解析
2019/09/28 Python
Django后台管理系统的图文使用教学
2020/01/20 Python
Css3圆角边框制作代码
2015/11/18 HTML / CSS
基于第一个PhoneGap(cordova)的应用详解
2013/05/03 HTML / CSS
萌新的HTML5 入门指南
2020/11/06 HTML / CSS
Abe’s of Maine:自1979以来销售相机和电子产品
2016/11/21 全球购物
俄罗斯建筑和装饰材料在线商店:Stroilandia
2020/07/25 全球购物
C语言基础笔试题
2013/04/27 面试题
工伤赔偿协议书
2014/04/15 职场文书
安全资料员岗位职责范本
2014/06/28 职场文书
停车场管理协议书范本
2014/10/08 职场文书
讲文明倡议书
2015/04/29 职场文书
一文搞懂python异常处理、模块与包
2021/06/26 Python
Nginx配置根据url参数重定向
2022/04/11 Servers
Go获取两个时区的时间差
2022/04/20 Golang