js对象的构造和继承实现代码


Posted in Javascript onDecember 05, 2010
<script> 
//定义js的user对象 
function User(name,age){ 
this.name=name, 
this.age=age, 
this.getName=function(){ 
return this.name; 
}, 
this.getAge=function(){ 
return this.age; 
} 
} 
//实例化一个对象 
var use=new User("aa",21); 
alert(use.name); 
alert(use.getAge()); 
//js对象继承 
/* 
3water.com 在面向对象的编程方法中,对象继承是必不可少的,那么怎么在javascript中实现继承机制呢。由于javascript并不是一个严格的面向对象的语言,因此在对象继承上也显的不一样。我们也来创建一个基类Polygon,代表一个多边形,一个多边形有个共同的属性就是边数(sides)和一个共同的方法计算面积(getAreas)。这样我们的这具Polygon类看起来就像下面这样定义: 
*/ 
function Polygon(iSides){ 
this.sides = iSides; 
} 
Polygon.prototype.getAreas = function(){ 
return 0; 
} 
/* 
因为基类并不能确定面积,因此在这里我们返回为0。 
接着我们就创建一个子类Triangle,一个三角形,显然这个三角形是要从多边形继承的,因此我们要让这个Triangle类继承Polygon类,并且要覆盖Polygon类的getAreas方法来返回三角形的面积。我们来看下在javascript中的实现: 
*/ 
function Triangle(iBase, iHeight){ 
Polygon.call(this,3); //在这里我们用Polygon.call()来调用Polygon的构造函数,并将3作为参数,表示这是一个三角形,因为边是确定的,所以在子类的构造函数中就不需要指定边了 
this.base = iBase; //三角形的底 
this.height = iHeight; //三角形的高 
} 
Triangle.prototype = new Polygon(); 
Triangle.prototype.getAreas = function(){ 
return 0.5 * this.base *this.height; //覆盖基类的getAreas方法,返回三角形的面积 
} /* 
参考上面的实现,我们再定义一个矩形: 
*/ 
function Rectangle(iWidth, iHeight){ 
Polygon.call(this,4); 
this.width = iWidth; 
this.height = iHeight; 
} 
Rectangle.prototype = new Polygon(); 
Rectangle.prototype.getAreas = function(){ 
return this.width * this.height; 
} 
/* 
好了,上面我们定义了一个基类和两个子数,下面我们来测试一个这两个子类是否能正常工作: 
*/ 
var t = new Triangle(3,6); 
var r = new Rectangle(4,5); 
alert(t.getAreas()); //输出9说明正确 
alert(r.getAreas()); //输出20说明正确 
</script>
Javascript 相关文章推荐
JavaScript窗口功能指南之在窗口中书写内容
Jul 21 Javascript
利用JS解决ie6不支持max-width,max-height问题的方法
Jan 02 Javascript
js获取当前日期时间及其它日期操作汇总
Mar 08 Javascript
给easyui datebox扩展一个清空的实例
Nov 09 Javascript
vuejs2.0实现分页组件使用$emit进行事件监听数据传递的方法
Feb 22 Javascript
jQuery UI Draggable + Sortable 结合使用(实例讲解)
Sep 07 jQuery
Angular HMR(热模块替换)功能实现方法
Apr 04 Javascript
Vue三层嵌套路由的示例代码
May 05 Javascript
JavaScript中toLocaleString()和toString()的区别实例分析
Aug 14 Javascript
解决layui前端框架 form表单,table表等内置控件不显示的问题
Aug 19 Javascript
理顺8个版本vue的区别(小结)
Sep 17 Javascript
vue如何实现动态加载脚本
Feb 05 Javascript
收集的一些Array及String原型对象的扩展实现代码
Dec 05 #Javascript
script标签的 charset 属性使用说明
Dec 04 #Javascript
本地对象Array的原型扩展实现代码
Dec 04 #Javascript
悄悄用脚本检查你访问过哪些网站的代码
Dec 04 #Javascript
jQuery)扩展jQuery系列之一 模拟alert,confirm(一)
Dec 04 #Javascript
高效的表格行背景隔行变色及选定高亮的JS代码
Dec 04 #Javascript
javascript innerHTML使用分析
Dec 03 #Javascript
You might like
PHP实现的博客欢迎提示功能(很特别哦)
2014/06/05 PHP
PHP获得数组交集与差集的方法
2015/06/10 PHP
PHP-FPM实现性能优化
2016/03/31 PHP
Javascript模板技术
2007/04/27 Javascript
javascript 使用 NodeList需要注意的问题
2013/03/04 Javascript
JQuery表格内容过滤的实现方法
2013/07/05 Javascript
利用javascript实现全部删或清空所选的操作
2014/05/27 Javascript
jQuery中:text选择器用法实例
2015/01/03 Javascript
Javascript URI 解析介绍
2015/03/15 Javascript
js+html5实现canvas绘制网页时钟的方法
2016/05/21 Javascript
微信小程序 实战小程序实例
2016/10/08 Javascript
JavaScript实现Java中Map容器的方法
2016/10/09 Javascript
Vue实现自带的过滤器实例
2017/03/09 Javascript
关于vue.js发布后路径引用的问题解决
2017/08/15 Javascript
js+html获取系统当前时间
2017/11/10 Javascript
Vue 中对图片地址进行拼接的方法
2018/09/03 Javascript
Node对CommonJS的模块规范
2019/11/06 Javascript
[01:08:57]2014 DOTA2国际邀请赛中国区预选赛 5 23 CIS VS LGD第二场
2014/05/24 DOTA
Python Web服务器Tornado使用小结
2014/05/06 Python
python实现中文转换url编码的方法
2016/06/14 Python
浅谈python类属性的访问、设置和删除方法
2016/07/25 Python
Linux RedHat下安装Python2.7开发环境
2017/05/20 Python
Python+OpenCV+pyQt5录制双目摄像头视频的实例
2019/06/28 Python
15行Python代码实现免费发送手机短信推送消息功能
2020/02/27 Python
python实现坦克大战
2020/04/24 Python
使用Python中tkinter库简单gui界面制作及打包成exe的操作方法(二)
2020/10/12 Python
Omio荷兰:预订火车、巴士和机票
2018/11/04 全球购物
巴西一家专门从事家居和装饰的连锁店:Camicado
2019/08/14 全球购物
给定一个时间点,希望得到其他时间点
2013/11/07 面试题
人事主管岗位职责
2014/01/30 职场文书
优秀教师的感人事迹
2014/02/04 职场文书
公司保密承诺书
2014/03/27 职场文书
租房协议书怎么写
2014/04/10 职场文书
关于清明节的演讲稿2015
2015/03/18 职场文书
跑出一片天观后感
2015/06/08 职场文书
python多线程方法详解
2022/01/18 Python