一个JavaScript继承的实现


Posted in Javascript onOctober 24, 2006

Author:尹伟铭

Blog:http://my.donews.com/yinwm/

如我前面的文章说的,对于JavaScript,一个类,就是一个function,他的类方法(也就是static的)都是作为这个function的一部分,而实例方法,都是在prototype上面的。
function ClassA() {
}

ClassA.staticMethod = function () {
}

ClassA.prototype.instanceMethod = function () {
}

在我这个实现当中,一个类的继承是拷贝父类的所有类方法,这样子类就有了父类的静态方法。
然后让子类的prototype.prototype指向父类的prototype.
然后可以根据自己的需要,重写一些方法。
function ClassB() {
}
ClassB.staticMethod = ClassA.staticMethod;
ClassB.prototype.prototype = ClassA.prototype;
ClassB.prototype.instanceMethod = function () {
// method 2
}

对于子类,使用一个prototype的链,来实现方法的实例方法的继承。之所以选择这种实现方法,是因为子类是要重写其中的某些方法的。而prototype又是一个reference,所以直接的写作ClassB.prototype = ClassA.prototype,会在重写ClassB的实例方法的同时,破坏ClassA的实例方法。而修改后的方法则会屏蔽父类的。

寻找方法的顺序是,instanceA.prototype.method -> ClassA.prototype.
此时对于类方法的继承,已经实现,现在需要实现在子类中,调用父类的方法。
对于Java,这样的使用是很平常的
public void method() {
super.method();
}
在JavsScript中,为了实现此类功能,所以必须保留一个parent的reference,指向ParentClass.prototype.
ClassB.prototype.parent = ClassA.prototype.
那么在instanceB里面调用this.parent.method.call(this);就可以使用父类的方法了。使用call调用,是为了把自己的数据传到父类。更漂亮的解决方法,我还没有想到。

所以完成的代码是
function ClassA() {
}

ClassA.prototype.method1 = function () {
}

ClassA.staticMethod = function () {
}

function ClassB(){
}

ClassB.staticMethod = ClassA.staticMethod;

ClassB.prototype.prototype = ClassB.prototype.parent = ClassA.prototype;

这个我抽象出来一个extend方法,

var LCore = function () {
}

LCore.extend = function (destination, source) {
// copy all functons
for (var prop in source) {
if (prop == “prototype”) {
continue;
}

destination.prototype[prop] = source[prop];
}

// make a reference for parent and reference prototype
destination.prototype.prototype = destination.prototype.parent = source.prototype;

return destination;

Javascript 相关文章推荐
远离JS灾难css灾难之 js私有函数和css选择器作为容器
Dec 11 Javascript
Jquery easyUI 更新行示例
Mar 06 Javascript
基于JavaScript实现瀑布流布局(二)
Jan 26 Javascript
从重置input file标签中看jQuery的 .val() 和 .attr(“value”) 区别
Jun 12 Javascript
Node.js读写文件之批量替换图片的实现方法
Sep 07 Javascript
使用D3.js构建实时图形的示例代码
Aug 28 Javascript
PM2自动部署代码步骤流程总结
Dec 10 Javascript
微信小程序template模板与component组件的区别和使用详解
May 22 Javascript
浅入深出Vue之自动化路由
Aug 06 Javascript
Vue实现Layui的集成方法步骤
Apr 10 Javascript
解决elementUI 切换tab后 el_table 固定列下方多了一条线问题
Jul 19 Javascript
Vue检测屏幕变化来改变不同的charts样式实例
Oct 26 Javascript
动态加载js的几种方法
Oct 23 #Javascript
用js怎么把&字符换成"&amp:"
Oct 19 #Javascript
对联广告js flash激活
Oct 19 #Javascript
怎么让脚本或里面的函数在所有图片都载入完毕的时候执行
Oct 17 #Javascript
菜单效果
Oct 14 #Javascript
Using the TextRange Object
Oct 14 #Javascript
使用TextRange获取输入框中光标的位
Oct 14 #Javascript
You might like
让这部DC动画新作刷新你的认知
2020/03/03 欧美动漫
PHP实现的限制IP投票程序IP来源分析
2016/05/04 PHP
php 反斜杠处理函数addslashes()和stripslashes()实例详解
2016/12/25 PHP
php魔法函数与魔法常量使用介绍
2017/07/23 PHP
使用jquery实现以post打开新窗口
2014/03/19 Javascript
Underscore.js 1.3.3 中文注释翻译说明
2015/06/25 Javascript
基于Jquery easyui 选中特定的tab
2015/11/17 Javascript
浅谈angularjs $http提交数据探索
2017/01/20 Javascript
JS实现两周内自动登录功能
2017/03/23 Javascript
从零开始学习Node.js系列教程之设置HTTP头的方法示例
2017/04/13 Javascript
Javarscript中模块(module)、加载(load)与捆绑(bundle)详解
2017/05/28 Javascript
详解javascript常用工具类的封装
2018/01/30 Javascript
angularjs使用gulp-uglify压缩后执行报错的解决方法
2018/03/07 Javascript
详解Vue2.5+迁移至Typescript指南
2019/08/01 Javascript
基于JavaScript 实现拖放功能
2019/09/12 Javascript
JS校验与最终登陆界面功能完整示例
2020/01/13 Javascript
vue抽出组件并传值实例
2020/07/31 Javascript
结合axios对项目中的api请求进行封装操作
2020/09/21 Javascript
[00:10]DOTA2全国高校联赛速递
2018/05/30 DOTA
[01:42]DOTA2 – 虚无之灵
2019/08/25 DOTA
[07:25]DOTA2-DPC中国联赛2月5日Recap集锦
2021/03/11 DOTA
浅谈Python单向链表的实现
2015/12/24 Python
python 中的list和array的不同之处及转换问题
2018/03/13 Python
Python2包含中文报错的解决方法
2018/07/09 Python
对Xpath 获取子标签下所有文本的方法详解
2019/01/02 Python
使用python Telnet远程登录执行程序的方法
2019/01/26 Python
Python求两点之间的直线距离(2种实现方法)
2019/07/07 Python
python3使用print打印带颜色的字符串代码实例
2019/08/22 Python
解决echarts中饼图标签重叠的问题
2020/05/16 Python
通过canvas转换颜色为RGBA格式及性能问题的解决
2019/11/22 HTML / CSS
德国高端单身人士交友网站:ElitePartner
2018/12/02 全球购物
海蓝之谜英国官网:La Mer英国
2020/01/15 全球购物
管理学专业个人求职信范文
2013/12/13 职场文书
党建工作汇报材料
2014/12/24 职场文书
务工证明怎么写
2015/06/18 职场文书
pytorch加载预训练模型与自己模型不匹配的解决方案
2021/05/13 Python