javascript 面向对象继承


Posted in Javascript onNovember 26, 2009

在prototype框架中的类继承实现机制

//为Object类添加静态方法:extend 
Object.extend = function(destination, source) { 
for(property in source) { 
destination[property] = source[property]; 
} 
return destination; 
} 
//通过Object类为每个对象添加方法extend 
Object.prototype.extend = function(object) { 
return Object.extend.apply(this, [this, object]); 
}

Object.extend方法很容易理解,它是Object类的一个静态方法,用于将参数中source的所有属性都赋值到destination对象中,并返回destination的引用。下面解释一下Object.prototype.extend的实现,因为Object是所有对象的基类,所以这里是为所有的对象都添加一个extend方法,函数体中的语句如下:
Object.extend.apply(this,[this,object]);
这一句是将Object类的静态方法作为对象的方法运行,第一个参数this是指向对象实例自身;第二个参数是一个数组,包括两个元素:对象本身和传进来的对象参数object。函数功能是将参数对象object的所有属性和方法赋值给调用该方法的对象自身,并返回自身的引用。有了这个方法,下面看类继承的实现:
<script language="JavaScript" type="text/javascript"> 
<!-- 
//定义extend方法 
Object.extend = function(destination, source) { 
for (property in source) { 
destination[property] = source[property]; 
} 
return destination; 
} 
Object.prototype.extend = function(object) { 
return Object.extend.apply(this, [this, object]); 
} 
//定义class1 
function class1(){ 
//构造函数 
} 
//定义类class1的成员 
class1.prototype={ 
method:function(){ 
alert("class1"); 
}, 
method2:function(){ 
alert("method2"); 
} } 
//定义class2 
function class2(){ 
//构造函数 
} 
//让class2继承于class1并定义新成员 
class2.prototype=(new class1()).extend({ 
method:function(){ 
alert("class2"); 
} 
}); 
//创建两个实例 
var obj1=new class1(); 
var obj2=new class2(); 
//试验obj1和obj2的方法 
obj1.method(); 
obj2.method(); 
obj1.method2(); 
obj2.method2(); 
//--> 
</script>

从运行结果可以看出,继承被正确的实现了,而且派生类的额外成员也可以以列表的形式加以定义.
Javascript 相关文章推荐
JS OOP包机制,类创建的方法定义
Nov 02 Javascript
js 调用本地exe的例子(支持IE内核的浏览器)
Dec 26 Javascript
JS保留两位小数,多位小数的示例代码
Jan 07 Javascript
使用jQuery动态加载js脚本文件的方法
Apr 03 Javascript
JQuery中serialize() 序列化
Mar 13 Javascript
JavaScript中的toString()和toLocaleString()方法的区别
Feb 15 Javascript
javascript 使用正则test( )第一次是 true,第二次是false
Feb 22 Javascript
vue 微信授权登录解决方案
Apr 10 Javascript
vue 标签属性数据绑定和拼接的实现方法
May 17 Javascript
webstorm中配置Eslint的两种方式及差异比较详解
Oct 19 Javascript
js针对图片加载失败的处理方法分析
Aug 24 Javascript
js最全的数组的降维5种办法(小结)
Apr 28 Javascript
javascript 获取元素位置的快速方法 getBoundingClientRect()
Nov 26 #Javascript
javascript或asp实现的判断身份证号码是否正确两种验证方法
Nov 26 #Javascript
Ext grid 添加右击菜单
Nov 26 #Javascript
JS 判断undefined的实现代码
Nov 26 #Javascript
为jquery.ui.dialog 增加“自动记住关闭时的位置”的功能
Nov 24 #Javascript
为jquery.ui.dialog 增加“在当前鼠标位置打开”的功能
Nov 24 #Javascript
JavaScript让IE浏览器event对象符合W3C DOM标准
Nov 24 #Javascript
You might like
php发送get、post请求的6种方法简明总结
2014/07/08 PHP
Yii框架获取当前controlle和action对应id的方法
2014/12/03 PHP
php约瑟夫问题解决关于处死犯人的算法
2015/03/23 PHP
php删除指定目录的方法
2015/04/03 PHP
php 实现Hash表功能实例详解
2016/11/29 PHP
ThinkPHP实现登录退出功能
2017/06/29 PHP
PHP批斗大会之缺失的异常详解
2019/07/09 PHP
JavaScript动态调整TextArea高度的代码
2010/12/28 Javascript
jquery实现图片裁剪思路及实现
2013/08/16 Javascript
JavaScript中判断整字类型最简洁的实现方法
2014/11/08 Javascript
理解javascript异步编程
2016/01/27 Javascript
JS获取字符串实际长度(包含汉字)的简单方法
2016/08/11 Javascript
JS创建Tag标签的方法详解
2017/06/09 Javascript
js实现城市级联菜单的2种方法
2017/06/23 Javascript
详解vue2.0 使用动态组件实现 Tab 标签页切换效果(vue-cli)
2017/08/30 Javascript
vue.js学习笔记之v-bind和v-on解析
2018/05/03 Javascript
前端路由&amp;webpack基础配置详解
2019/06/10 Javascript
改变layer confirm弹窗按钮的颜色方法
2019/09/12 Javascript
浅谈Vue2.4.0 $attrs与inheritAttrs的具体使用
2020/03/08 Javascript
Selenium的使用详解
2018/10/19 Python
kali中python版本的切换方法
2019/07/11 Python
Pytorch .pth权重文件的使用解析
2020/02/14 Python
python 安装教程之Pycharm安装及配置字体主题,换行,自动更新
2020/03/13 Python
HTML5中的nav标签学习笔记
2016/06/24 HTML / CSS
canvas像素画板的实现代码
2018/11/21 HTML / CSS
经典c++面试题二
2015/08/14 面试题
给客户的道歉信
2014/01/13 职场文书
保护黄河倡议书
2014/05/16 职场文书
农行心得体会
2014/09/02 职场文书
2014年纪检工作总结
2014/11/12 职场文书
2015年度个人业务工作总结
2015/04/27 职场文书
办公用品质量保证书
2015/05/11 职场文书
淮海战役观后感
2015/06/11 职场文书
于丹讲座视频观后感
2015/06/15 职场文书
2016教师给学生的毕业寄语
2015/12/04 职场文书
数据库之SQL技巧整理案例
2021/07/07 SQL Server