Javascript 面向对象 继承


Posted in Javascript onMay 13, 2010

在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技巧
May 06 Javascript
javascript操作excel生成报表示例
May 08 Javascript
javascript实现单击和双击并存的方法
Dec 13 Javascript
javascript生成大小写字母
Jul 03 Javascript
通过点击jqgrid表格弹出需要的表格数据
Dec 02 Javascript
JS简单实现tab切换效果的多窗口显示功能
Sep 07 Javascript
javascript设置文本框光标的方法实例小结
Nov 04 Javascript
Angularjs中ng-repeat的简单实例
Aug 25 Javascript
Angular CLI在Angular项目中如何使用scss详解
Apr 10 Javascript
过滤器vue.filters的使用方法实现
Sep 18 Javascript
Vue.js 无限滚动列表性能优化方案
Dec 02 Javascript
基于VUE实现简单的学生信息管理系统
Jan 13 Vue.js
Javascript 面向对象 重载
May 13 #Javascript
JavaScript 面向对象的 私有成员和公开成员
May 13 #Javascript
限制文本框输入N个字符的js代码
May 13 #Javascript
javascript preload&lazy load
May 13 #Javascript
javascript 当前日期转化为中文的实现代码
May 13 #Javascript
JAVASCRIPT实现的WEB页面跳转以及页面间传值方法
May 13 #Javascript
IE8下关于querySelectorAll()的问题
May 13 #Javascript
You might like
DC动漫人物排行
2020/03/03 欧美动漫
PHP多线程抓取网页实现代码
2010/07/22 PHP
PHP大小写问题:函数名和类名不区分,变量名区分
2013/06/17 PHP
PHP调用Linux命令权限不足问题解决方法
2015/02/07 PHP
javascript 操作Word和Excel的实现代码
2009/10/26 Javascript
javascript算法学习(直接插入排序)
2011/04/12 Javascript
js判断客户端是iOS还是Android等移动终端的方法
2013/12/11 Javascript
Node.js中AES加密和其它语言不一致问题解决办法
2014/03/10 Javascript
jQuery获取URL请求参数的方法
2015/07/18 Javascript
js+flash实现的5图变换效果广告代码(附演示与demo源码下载)
2016/04/01 Javascript
js 定义对象数组(结合)多维数组方法
2016/07/27 Javascript
Bootstrap分页插件之Bootstrap Paginator实例详解
2016/10/15 Javascript
Javascript的动态增加类的实现方法
2016/10/20 Javascript
JS简单实现获取元素的封装操作示例
2017/04/07 Javascript
JavaScript数据结构学习之数组、栈与队列
2017/05/02 Javascript
Angular7创建项目、组件、服务以及服务的使用
2019/02/19 Javascript
Vue强制组件重新渲染的方法讨论
2020/02/03 Javascript
详解使用mocha对webpack打包的项目进行"冒烟测试"的大致流程
2020/04/27 Javascript
浅谈vue项目,访问路径#号的问题
2020/08/14 Javascript
详解supervisor使用教程
2017/11/21 Python
nohup后台启动Python脚本,log不刷新的解决方法
2019/01/14 Python
对Python 多线程统计所有csv文件的行数方法详解
2019/02/12 Python
python+mysql实现教务管理系统
2019/02/20 Python
Dlib+OpenCV深度学习人脸识别的方法示例
2019/05/14 Python
python 机器学习之支持向量机非线性回归SVR模型
2019/06/26 Python
python 如何去除字符串头尾的多余符号
2019/11/19 Python
python读取dicom图像示例(SimpleITK和dicom包实现)
2020/01/16 Python
python GUI库图形界面开发之PyQt5信号与槽的高级使用技巧装饰器信号与槽详细使用方法与实例
2020/03/06 Python
CSS3中利用animation属性创建雪花飘落特效
2014/05/14 HTML / CSS
Python面试题:Python是如何进行内存管理的
2014/08/04 面试题
幼儿园元旦亲子活动方案
2014/02/17 职场文书
小学生安全责任书
2014/07/25 职场文书
2014年乡镇领导个人整改措施
2014/09/19 职场文书
党员示范岗材料
2014/12/19 职场文书
初中数学课堂教学反思
2016/02/17 职场文书
2019年幼儿园家长接送责任书
2019/10/29 职场文书