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中将Object转换为String函数代码 (json str)
Apr 29 Javascript
JavaScript中获取样式的原生方法小结
Oct 08 Javascript
javascript将数字转换整数金额大写的方法
Jan 27 Javascript
逐一介绍Jquery data()、Jquery stop()、jquery delay()函数(详)
Nov 04 Javascript
AngularJS 模型详细介绍及实例代码
Jul 27 Javascript
基于MVC+EasyUI的web开发框架之使用云打印控件C-Lodop打印页面或套打报关运单信息
Aug 29 Javascript
bootstrap jquery dataTable 异步ajax刷新表格数据的实现方法
Feb 10 Javascript
js学习总结_轮播图之渐隐渐现版(实例讲解)
Jul 17 Javascript
微信小程序的日期选择器的实例详解
Sep 29 Javascript
electron-vue开发环境内存泄漏问题汇总
Oct 10 Javascript
vue中使用router全局守卫实现页面拦截的示例
Oct 23 Javascript
Flexible.js可伸缩布局实现方法详解
Nov 13 Javascript
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
PHILIPS L4X25T电路分析和打理
2021/03/02 无线电
综合图片计数器
2006/10/09 PHP
PHP性能优化准备篇图解PEAR安装
2011/12/05 PHP
js字符编码函数区别分析
2008/06/05 Javascript
JavaScript 全面解析各种浏览器网页中的JS 执行顺序
2009/02/17 Javascript
File文件控件,选中文件(图片,flash,视频)即立即预览显示
2009/04/09 Javascript
Jquery替换已存在于element上的event的方法
2010/03/09 Javascript
js禁止小键盘输入数字功能代码
2011/08/01 Javascript
jquery中dom操作和事件的实例学习 仿yahoo邮箱登录框的提示效果
2011/11/30 Javascript
使用 Node.js 做 Function Test实现方法
2013/10/25 Javascript
详解JavaScript基于面向对象之创建对象(1)
2015/12/10 Javascript
jQuery给元素添加样式的方法详解
2015/12/30 Javascript
jQuery EasyUI之DataGrid使用实例详解
2016/01/04 Javascript
JavaScript获取短信验证码(周期性)
2016/12/29 Javascript
利用node.js本地搭建HTTP服务器
2017/04/19 Javascript
JavaScript适配器模式详解
2017/10/19 Javascript
JS实现数组简单去重及数组根据对象中的元素去重操作示例
2018/01/05 Javascript
nodejs实现一个word文档解析器思路详解
2018/08/14 NodeJs
微信公众号H5之微信分享常见错误和问题(小结)
2019/11/14 Javascript
elementUI同一页面展示多个Dialog的实现
2020/11/19 Javascript
Python实现Linux命令xxd -i功能
2016/03/06 Python
Python reduce()函数的用法小结
2017/11/15 Python
Python实现在tkinter中使用matplotlib绘制图形的方法示例
2018/01/18 Python
Python实现多线程的两种方式分析
2018/08/29 Python
bluepy 一款python封装的BLE利器简单介绍
2019/06/25 Python
python 解决flask 图片在线浏览或者直接下载的问题
2020/01/09 Python
HTML5中5个简单实用的API
2014/04/28 HTML / CSS
阿拉伯书店:Jamalon
2019/07/24 全球购物
审核会计岗位职责
2013/11/08 职场文书
计算机相关的自我评价
2014/01/15 职场文书
高三体育教学反思
2014/01/29 职场文书
机械制造毕业生求职信
2014/03/03 职场文书
期末学生评语大全
2014/04/24 职场文书
个人剖析材料及整改措施
2014/10/07 职场文书
库房管理员岗位职责
2015/02/12 职场文书
母亲节寄语大全
2015/02/27 职场文书