javascript面向对象之Javascript 继承


Posted in Javascript onMay 04, 2010

上几节讲了 JavaScript 面向对象之命名空间 、 javascript 面向对象的JavaScript类 、 JavaScript 面向对象的之私有成员和公开成员 与 Javascript 面向对象之重载,大家可以先看上面的再继续往下看。

在JavaScript中实现继承可以有多种方法,下面说两种常见的。

一,call 继承,先看代码:

先定义一个“人”类

//人类 
Person=function(){ 
this.name="草泥马"; 
this.eat=function(){ 
alert("我要吃饭"); 
} 
this.sleep=function(){ 
alert("我要睡觉"); 
} 
}

再定义一个学生类,让它继承于Person

//学生类 
Student=function(){ 
Person.call(this);//继承Person类 
this.doHomework=function(){ 
alert("老师来了,作业借我抄下"); 
} 
}

关键看 Person.call(this)这句,其中this代表当前对象,即Student ,这很容易理解,而Person.call(this)的意思是:将Person类的所有的公开成员“附加”给Student类,让Student也具有了Person的所有功能。

和高级语言一样,如果子类中出现了和父类中同名的成员,则会将其覆盖,也就是所谓的“重写”了。

同样的,我们再定义一个女孩类 :

//女孩类 
Girl=function(){ 
Person.call(this);//继承Person类 
this.sex="女"; 
}

JavaScript是可以实现多重继承的,请看下面的Master(硕士)类,这个Master 自然是个学生,但同时又是个漂亮MM,于是有了下面的代码:

//硕士类 
Master=function(){ 
Student.call(this);//继承Student类 
Girl.call(this);//继承Girl类 
this.degree="硕士";//学历 }

我们可以测试一下:

var master=new Master(); 
master.name="凤姐"; 
master.eat(); 
master.doHomework(); 
alert("偶是名字叫:"+master.name); 
alert("偶的性别是:"+master.sex);

多重继承时要注意顺序,如果两个类中有相同名称的成员,那么后一个将覆盖前一个,也就是说当前类只会继承后一个类中的成员。

call 方法继承就说到这,如果大家对call方法不清楚,就请去问问谷歌兄,我就不赘述了,网上转载得不要太多。下面说下另外一种继承方式。

二,prototype 原型继承:

我们再定义一个班长类:

//班长类 
SquadLeader=function (){ 
//打招呼 
this.hi=function(){ 
alert("同学们好,我现在是班长了"); 
} 
}

上面定义了一个硕士类,现在这个硕士被提升为班长了,所以这个Master要继承SquadLeader了,这次我们用prototype 来实现,请看下面代码:

Master.prototype=new SquadLeader();//prototype 属性指向一个对象 
//或者 
//Master.prototype=SquadLeader.prototype; 
这样Master就继承了SquadLeader类,就这么一句话,这里有两种形式,其实原理是一样的。意思是:将SquadLeader的“灵魂”拷贝给了Master,于是从此SquadLeader能做的事,Master都可以做了。 
  测试一下: 
var master=new Master(); 
master.hi()//输出“同学们好,我现在是班长了”

我个人比较喜欢用第一种方案(call 继承)来实现继承,所有代码都包在一个“{}”内,一目了然,在书写风格上较之于第二种更接近于C#。prototype 属性我一般用来对已有的类做扩展。

JavaScript是门非常灵活的语言,实现继承可能还有其他更好的方式,大家可以去研究挖掘,我在这就当是抛了块砖头, 希望能引出华美的玉石!

Javascript 相关文章推荐
AJAX使用了UpdatePanel后无法使用alert弹出脚本
Apr 02 Javascript
深入理解JavaScript系列(12) 变量对象(Variable Object)
Jan 16 Javascript
jquery实现下拉框功能效果【实例代码】
May 06 Javascript
JavaScript实现DOM对象选择器
Sep 24 Javascript
省市区三级联动jquery实现代码
Apr 15 Javascript
js实现移动端轮播图效果
Dec 09 Javascript
纯js实现隔行变色效果
Nov 29 Javascript
利用JS判断客户端类型你应该知道的四种方法
Dec 22 Javascript
JavaScript中call和apply方法的区别实例分析
Aug 03 Javascript
Vue自定义属性实例分析
Feb 23 Javascript
js的新生代垃圾回收知识点总结
Aug 22 Javascript
jQuery实现可以计算进制转换的计算器
Oct 19 jQuery
Javascript 面向对象之重载
May 04 #Javascript
JavaScript 面向对象的之私有成员和公开成员
May 04 #Javascript
javascript 面向对象的JavaScript类
May 04 #Javascript
JavaScript 面向对象之命名空间
May 04 #Javascript
10个实用的脚本代码工具
May 04 #Javascript
利用location.hash实现跨域iframe自适应
May 04 #Javascript
Array.prototype 的泛型应用分析
Apr 30 #Javascript
You might like
PHP进阶学习之垃圾回收机制详解
2019/06/18 PHP
javascript 兼容鼠标滚轮事件
2009/04/07 Javascript
实现超用户体验 table排序javascript实现代码
2009/06/22 Javascript
JS 面向对象的5钟写法
2009/07/31 Javascript
有道JavaScript监听浏览器的问题
2010/06/23 Javascript
菜鸟学习JavaScript小实验之函数引用
2010/11/17 Javascript
JavaScript高级程序设计(第3版)学习笔记12 js正则表达式
2012/10/11 Javascript
jQuery jcrop插件截图使用方法
2013/11/20 Javascript
jquery如何实现锚点链接之间的平滑滚动
2013/12/02 Javascript
javascript Array 数组常用方法
2015/04/05 Javascript
简介JavaScript中Boolean.toSource()方法的使用
2015/06/05 Javascript
总结Javascript中的隐式类型转换
2016/08/24 Javascript
jQuery简单倒计时效果完整示例
2016/09/20 Javascript
angularjs 中$apply,$digest,$watch详解
2016/10/13 Javascript
js注册时输入合法性验证方法
2017/10/21 Javascript
nodejs使用express获取get和post传值及session验证的方法
2017/11/09 NodeJs
js数组方法reduce经典用法代码分享
2018/01/07 Javascript
深入浅析javascript函数中with
2018/10/28 Javascript
js实现页面多个日期时间倒计时效果
2019/06/20 Javascript
javascript实现fetch请求返回的统一拦截
2019/12/22 Javascript
JavaScript中arguments的使用方法详解
2020/12/20 Javascript
[01:28:31]《加油DOTA》真人秀 第五期
2014/09/01 DOTA
[49:58]完美世界DOTA2联赛PWL S3 Magma vs DLG 第一场 12.18
2020/12/19 DOTA
python基于queue和threading实现多线程下载实例
2014/10/08 Python
python中使用 xlwt 操作excel的常见方法与问题
2019/01/13 Python
python GUI库图形界面开发之PyQt5拖放控件实例详解
2020/02/25 Python
520使用Python实现“我爱你”表白
2020/05/20 Python
Python logging自定义字段输出及打印颜色
2020/11/30 Python
浅析python连接数据库的重要事项
2021/02/22 Python
老板电器官方购物商城:老板油烟机、燃气灶、消毒柜、电烤箱
2018/05/30 全球购物
PREMIUM-MALL法国:行李、箱包及配件在线
2019/05/30 全球购物
WatchShop法国:英国排名第一的独立手表零售商
2020/02/17 全球购物
培训主管的岗位职责
2013/11/23 职场文书
建房协议书
2014/04/11 职场文书
材料专业大学毕业生自荐书
2014/07/02 职场文书
幼儿园开学温馨提示
2015/07/15 职场文书