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面向对象编程(二) 构造函数的继承
Aug 28 Javascript
纯javascript代码实现计算器功能(三种方法)
Sep 07 Javascript
Seajs 简易文档 提供简单、极致的模块化开发体验
Apr 13 Javascript
jQuery-mobile事件监听与用法详解
Nov 23 Javascript
对于js垃圾回收机制的理解
Sep 14 Javascript
浅谈vue中数据双向绑定的实现原理
Sep 14 Javascript
Angular实现预加载延迟模块的示例
Oct 12 Javascript
vue.js与后台数据交互的实例讲解
Aug 08 Javascript
jQuery访问json文件中数据的方法示例
Jan 28 jQuery
微信小程序云开发 搭建一个管理小程序
May 17 Javascript
Vue+element 解决浏览器自动填充记住的账号密码问题
Jun 11 Javascript
js+html+css实现手动轮播和自动轮播
Dec 30 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去除反斜杠)
2013/09/28 PHP
php中try catch捕获异常实例详解
2014/11/21 PHP
Thinkphp实现自动验证和自动完成
2015/12/19 PHP
jquery中输入验证中一个不错的效果
2010/08/21 Javascript
jQuery之自动完成组件的深入解析
2013/06/19 Javascript
JS正则表达式获取分组内容的方法详解
2013/11/15 Javascript
JS实现的自定义右键菜单实例二则
2015/09/01 Javascript
JavaScript代码实现禁止右键、禁选择、禁粘贴、禁shift、禁ctrl、禁alt
2015/11/17 Javascript
基于JS实现无缝滚动思路及代码分享
2016/06/07 Javascript
浅谈jquery.form.js的ajaxSubmit和ajaxForm的使用
2016/09/09 Javascript
浅谈DOM的操作以及性能优化问题-重绘重排
2017/01/08 Javascript
二维码图片生成器QRCode.js简单介绍
2017/08/18 Javascript
webpack-dev-server远程访问配置方法
2018/02/22 Javascript
详解vue-cli3多页应用改造
2019/06/04 Javascript
vue实现循环滚动列表
2020/06/30 Javascript
JS实现鼠标按下拖拽效果
2020/07/23 Javascript
简化Python的Django框架代码的一些示例
2015/04/20 Python
简述Python中的进程、线程、协程
2016/03/18 Python
python画一个玫瑰和一个爱心
2020/08/18 Python
python ---lambda匿名函数介绍
2019/03/13 Python
Python3实现的回文数判断及罗马数字转整数算法示例
2019/03/27 Python
python 反编译exe文件为py文件的实例代码
2019/06/27 Python
Pytorch中的VGG实现修改最后一层FC
2020/01/15 Python
keras模型可视化,层可视化及kernel可视化实例
2020/01/24 Python
CSS3实现文字描边的2种方法(小结)
2020/02/14 HTML / CSS
HTML5实现简单图片上传所遇到的问题及解决办法
2016/01/20 HTML / CSS
阿迪达斯新加坡官方网站:adidas新加坡
2019/12/06 全球购物
美国最大最全的亚洲购物网站:美国亚米网(Yamibuy)
2020/05/05 全球购物
外国语学院毕业生自荐信
2013/10/28 职场文书
企业办公室岗位职责
2014/03/12 职场文书
教师作风建设剖析材料
2014/10/11 职场文书
授权委托书协议书
2014/10/16 职场文书
2015年幼儿园学前班工作总结
2015/05/18 职场文书
【海涛教你打DOTA】黑鸟第一视角解说
2022/04/01 DOTA
使用Python获取字典键对应值的方法
2022/04/26 Python
Shell中的单中括号和双中括号的用法详解
2022/12/24 Servers