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 相关文章推荐
Prototype使用指南之array.js
Jan 10 Javascript
ExtJS实现文件下载的方法实例
Nov 09 Javascript
jquery分页对象使用示例
Apr 01 Javascript
JS中三目运算符和if else的区别分析与示例
Nov 21 Javascript
javascript中cookie对象用法实例分析
Jan 30 Javascript
javascript中局部变量和全局变量的区别详解
Feb 27 Javascript
jQuery实现的调整表格行tr上下顺序
Jan 10 Javascript
JS获取复选框的值,并传递到后台的实现方法
May 30 Javascript
浅谈Vue内置component组件的应用场景
Mar 27 Javascript
JavaScript指定断点操作实例教程
Sep 18 Javascript
layui点击左侧导航栏,实现不刷新整个页面,只刷新局部的方法
Sep 25 Javascript
vue+swiper实现左右滑动的测试题功能
Oct 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
MySQL的FIND_IN_SET函数使用方法分享
2012/03/27 PHP
JS去除字符串的空格增强版(可以去除中间的空格)
2009/08/26 Javascript
SlideView 图片滑动(扩展/收缩)展示效果
2010/08/01 Javascript
JQuery的Alert消息框插件使用介绍
2010/10/09 Javascript
JSON 数字排序多字段排序介绍
2013/09/18 Javascript
jquery绑定事件不生效的解决方法
2014/02/11 Javascript
Nodejs中自定义事件实例
2014/06/20 NodeJs
教你如何自定义百度分享插件以及bshare分享插件的分享按钮
2014/06/20 Javascript
JS实现先显示大图后自动收起显示小图的广告代码
2015/09/04 Javascript
Jquery zTree 树控件异步加载操作
2016/02/25 Javascript
bootstrap datepicker限定可选时间范围实现方法
2016/09/28 Javascript
vue构建动态表单的方法示例
2018/09/22 Javascript
微信小程序实现底部弹出框
2020/11/18 Javascript
[02:07]DOTA2新英雄展现中国元素,完美“圣典”亮相央视
2016/12/19 DOTA
[01:06:26]全国守擂赛第二周 Team Coach vs DeMonsTer
2020/04/28 DOTA
python实现得到一个给定类的虚函数
2014/09/28 Python
Python的gevent框架的入门教程
2015/04/29 Python
numpy使用技巧之数组过滤实例代码
2018/02/03 Python
python3爬虫学习之数据存储txt的案例详解
2019/04/24 Python
扩展Django admin的list_filter()可使用范围方法
2019/08/21 Python
Python解压 rar、zip、tar文件的方法
2019/11/19 Python
Python中正则表达式对单个字符,多个字符和匹配边界等使用
2021/01/27 Python
Python 转移文件至云对象存储的方法
2021/02/07 Python
CSS3教程(5):网页背景图片
2009/04/02 HTML / CSS
Sperry澳大利亚官网:源自美国帆船鞋创始品牌
2019/07/29 全球购物
三个Unix的命令面试题
2015/04/12 面试题
热能动力工程毕业生自荐信
2013/11/07 职场文书
大学本科毕业生的自我鉴定范文
2013/11/19 职场文书
《日月潭》教学反思
2014/02/28 职场文书
体育节口号
2014/06/19 职场文书
税务干部个人整改措施思想汇报
2014/10/10 职场文书
2014年团工作总结
2014/11/27 职场文书
2016年元旦致辞
2015/08/01 职场文书
Mysql外键约束的创建与删除的使用
2022/03/03 MySQL
详解MySQL的主键查询为什么这么快
2022/04/03 MySQL
Golang jwt身份认证
2022/04/20 Golang