JavaScript继承模式粗探


Posted in Javascript onJanuary 12, 2016

真正意义上来说Javascript并不是一门面向对象的语言,没有提供传统的继承方式,但是它提供了一种原型继承的方式,利用自身提供的原型属性来实现继承。Javascript原型继承是一个被说烂掉了的话题,但是自己对于这个问题一直没有彻底理解,今天花了点时间又看了一遍《Javascript模式》中关于原型实现继承的几种方法,下面来谈谈JS中比较简单的继承方法,如果大家有不同意见,欢迎建议。

最基础的原型链继承在这里就不复述了,主要讲一下其他的继承模式。

1.借用构造函数继承

function Father (name) {
this.name=name;
}
function Son (name) {
Father.call(this,name); //在子类型中调用超类型的构造函数
this.age=15;
}
var me=new Son("Su");

好处:可以为子类型传递参数,如图中的name属性。

坏处:1.方法在构造函数中定义,无法复用。2.超类型原型中定义的方法对子类型是不可见的。

2.组合继承(综合原型链与构造函数)

//超类型构造函数function Father (name) {
this.name=name;
this.famMember=[];
}//超类型构造函数原型方法
Father.prototype.sayName=function () {
alert(this.name);
}//子类型构造函数
function Son (name,age) {
Father.call(this,name); //构造函数方法
this.age=age;
}
Son.prototype=new Father(); //重写子类型原型对象
Son.prototype.constructor=Son; //重写构造函数属性指向子类型
Son.prototype.sayAge=function () {
alert(this.age);
} //重写原型对象后再加入方法
var me=new Son("Su",15);
me.famMember.push("dad","mom"); //子类型可以调用超类型构造函数内的方法var he=new Son("Li",14);alert(he.famMember); // []

好处:不同的子类既可以拥有自己的属性,也可以使用相同的方法。

坏处:这种方法需要调用2次超类型的构造函数,同名的属性方法会被覆盖一次。

3.原型式继承 (类似Object.create())

function object (o) {
function F () {}
F.prototype=o;
return new F();
}var obj={}; //将obj对象传入作为新对象的原型。var me=object(obj);

使用这种方法继承需要有一个对象作为原型对象,所以所有继承其的子类型的属性方法都是共用的。

ES5通过新增Object.creatr()方法规范了原型式继承。

4.寄生式继承 (可以设置私有方法的原型式继承)

function object (o) {
function F () {}
F.prototype=o;
return new F();
}
var obj={}; //将obj对象传入作为新对象的原型。到这里都与原型式继承相同function creObj(o) {var clone=object(obj);
clone.sayHi=function () {

alert("Hi");
};return clone; }
var me=creObj(obj);

好处:这种方式弥补了原型式继承只有公有属性方法的缺陷,使子类型能有私有属性方法。

5.寄生组合式继承

function inherit (father,son) {
var pro=Object(father.prototype); //创建超类型原型对象的副本
pro.constructor=son;
son.prototype=pro;



 //将副本作为子类型的原型对象
}

本方法用于弥补组合继承中属性方法覆盖的问题。

用上图代码代替组合继承中 Son.prototype=new Father(); 这段代码。这样只需调用一次父类型的构造函数,避免了创造多余不必要的属性方法,并且保持了原型链不改变,是一种理想的引用类型继承方法。

关于js继承模式先粗略给大家介绍这么多,相信对大家有所帮助,更多信息请继续关注三水点靠木网站。

Javascript 相关文章推荐
基于jQuery的js分页代码
Jun 10 Javascript
js输出列表实现代码
Sep 12 Javascript
js兼容的placeholder属性详解
Aug 18 Javascript
分享javascript计算时间差的示例代码
Mar 19 Javascript
简单的分页代码js实现
May 17 Javascript
微信小程序 中wx.chooseAddress(OBJECT)实例详解
Mar 31 Javascript
webpack实现热更新(实施同步刷新)
Jul 28 Javascript
vue中路由参数传递可能会遇到的坑
Dec 07 Javascript
Javascript读写cookie的实例源码
Mar 16 Javascript
vue 返回上一页,页面样式错乱的解决
Nov 14 Javascript
jQuery实现简单日历效果
Jul 05 jQuery
微信小程序实现购物车小功能
Dec 30 Javascript
轻松实现Bootstrap图片轮播
Apr 20 #Javascript
探析浏览器执行JavaScript脚本加载与代码执行顺序
Jan 12 #Javascript
学习JavaScript设计模式之策略模式
Jan 12 #Javascript
基于jQuery1.9版本如何判断浏览器版本类型
Jan 12 #Javascript
jQuery版本升级踩坑大全
Jan 12 #Javascript
基于jQuery实现点击最后一行实现行自增效果的表格
Jan 12 #Javascript
7个jQuery最佳实践
Jan 12 #Javascript
You might like
DC动漫人物排行
2020/03/03 欧美动漫
php中unlink()、mkdir()、rmdir()等方法的使用介绍
2012/12/21 PHP
PHP register_shutdown_function函数的深入解析
2013/06/03 PHP
PHP中使用localhost连接Mysql不成功的解决方法
2014/08/20 PHP
在WordPress中实现评论头像的自定义默认和延迟加载
2015/11/24 PHP
反射调用private方法实践(php、java)
2015/12/21 PHP
如何使用微信公众平台开发模式实现多客服
2016/01/06 PHP
PHP数字前补0的自带函数sprintf 和number_format的用法(详解)
2017/02/06 PHP
js玩一玩WSH吧
2007/02/23 Javascript
xml 与javascript结合的问题解决方法
2007/03/24 Javascript
JQueryEasyUI Layout布局框架的使用
2013/04/08 Javascript
intro.js 页面引导简单用法 分享
2013/08/06 Javascript
web前端开发JQuery常用实例代码片段(50个)
2015/08/28 Javascript
关于session和cookie的简单理解
2016/06/08 Javascript
深入理解Commonjs规范及Node模块实现
2017/05/17 Javascript
bootstrap select2插件用ajax来获取和显示数据的实例
2018/08/09 Javascript
Vue实现移动端页面切换效果【推荐】
2018/11/13 Javascript
three.js中多线程的使用及性能测试详解
2021/01/07 Javascript
使用70行Python代码实现一个递归下降解析器的教程
2015/04/17 Python
python中sleep函数用法实例分析
2015/04/29 Python
Python3读取UTF-8文件及统计文件行数的方法
2015/05/22 Python
使用Python的Flask框架构建大型Web应用程序的结构示例
2016/06/04 Python
Django重装mysql后启动报错:No module named ‘MySQLdb’的解决方法
2018/04/22 Python
python 将list转成字符串,中间用符号分隔的方法
2018/10/23 Python
详解HTML5中的拖放事件(Drag 和 drop)
2016/11/14 HTML / CSS
Origins悦木之源香港官网:雅诗兰黛集团高端植物护肤品牌
2018/03/21 全球购物
请描述一下”is a”关系和”has a”关系
2015/02/03 面试题
小学生红领巾广播稿
2014/01/21 职场文书
班级口号大全
2014/06/09 职场文书
见习报告的格式
2014/10/31 职场文书
2015年公司中秋节致辞
2015/07/31 职场文书
三严三实·严以修身心得体会
2016/01/15 职场文书
如何利用pygame实现打飞机小游戏
2021/05/30 Python
bat批处理之字符串操作的实现
2022/03/16 Python
详细介绍python操作RabbitMq
2022/04/12 Python
利用正则表达式匹配浮点型数据
2022/05/30 Java/Android