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 相关文章推荐
JavaScript中的isXX系列是否继续使用的分析
Apr 16 Javascript
往光标所在位置插入值的js代码
Sep 22 Javascript
自己封装的javascript事件队列函数版
Jun 12 Javascript
JQuery实现表格动态增加行并对新行添加事件
Jul 30 Javascript
JavaScript组件焦点与页内锚点间传值的方法
Feb 02 Javascript
JavaScript必知必会(二) null 和undefined
Jun 08 Javascript
JS点击某个图标或按钮弹出文件选择框的实现代码
Sep 27 Javascript
seaJs使用心得之exports与module.exports的区别实例分析
Oct 13 Javascript
vue input输入框模糊查询的示例代码
May 22 Javascript
浅谈js闭包理解
Apr 01 Javascript
js实现圆形显示鼠标单击位置
Feb 11 Javascript
vue-router中hash模式与history模式的区别
Jun 23 Vue.js
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
超人钢铁侠联手合作?美漫作家呼吁DC漫威合作联动以抵抗疫情
2020/04/09 欧美动漫
php URL跳转代码 减少外链
2011/06/25 PHP
PHP函数篇详解十进制、二进制、八进制和十六进制转换函数说明
2011/12/05 PHP
php ajax实现文件上传进度条
2016/03/29 PHP
php while循环控制的简单实例
2016/05/30 PHP
基于jQueryUI和Corethink实现百度的搜索提示功能
2016/11/09 PHP
JavaScript在IE和Firefox(火狐)的不兼容问题解决方法小结
2010/04/13 Javascript
jQuery实现鼠标划过展示大图的方法
2015/03/09 Javascript
javascript制作游戏开发碰撞检测的封装代码
2015/03/31 Javascript
javascript实现动态导入js与css等静态资源文件的方法
2015/07/25 Javascript
使用jsonp实现跨域获取数据实例讲解
2016/12/25 Javascript
JS实现json的序列化和反序列化功能示例
2017/06/13 Javascript
jQuery查找和过滤_动力节点节点Java学院整理
2017/07/04 jQuery
vue webpack打包优化操作技巧
2018/02/22 Javascript
详解JavaScript 中 if / if...else...替换方式
2018/07/15 Javascript
JavaScript事件冒泡与事件捕获实例分析
2018/08/01 Javascript
vue解决一个方法同时发送多个请求的问题
2018/09/25 Javascript
[51:15]2014 DOTA2国际邀请赛中国区预选赛 Orenda VS LGD-GAMING
2014/05/22 DOTA
python抓取网页图片示例(python爬虫)
2014/04/27 Python
利用Python进行数据可视化常见的9种方法!超实用!
2018/07/11 Python
Python3 pandas 操作列表实例详解
2019/09/23 Python
Python3.5 win10环境下导入kera/tensorflow报错的解决方法
2019/12/19 Python
python通过文本在一个图中画多条线的实例
2020/02/21 Python
python3 使用openpyxl将mysql数据写入xlsx的操作
2020/05/15 Python
记录一下scrapy中settings的一些配置小结
2020/09/28 Python
Carolina Lemke Berlin澳大利亚官网:时尚太阳镜品牌
2019/09/17 全球购物
写一个函数返回1+2+3+…+n的值(假定结果不会超过长整型变量的范围)
2014/09/05 面试题
医学生自荐信
2013/12/03 职场文书
茶叶生产计划书
2014/01/10 职场文书
好家长事迹材料
2014/01/23 职场文书
关于国庆节的演讲稿
2014/09/05 职场文书
公司领导九九重阳节发言稿2014
2014/09/25 职场文书
2015年社区综治工作总结
2015/04/21 职场文书
老干部座谈会主持词
2015/07/03 职场文书
Python Matplotlib绘制动画的代码详解
2022/05/30 Python
Redis基本数据类型哈希Hash常用操作命令
2022/06/01 Redis