javascript 用原型继承来实现对象系统


Posted in Javascript onMarch 22, 2010

javascript中,对象没有原型,而构造器有原型
原型的含义:如果构造器有一个原型对象 A,则由该构造器创建的实例都必然复制自A

/*申明2个构造器*/ 
var flower=function(){ 
this.name="nokia"; 
} 
var flower2=function(){ 
this.age=22; 
} 
/*原型链*/ 
flower2.prototype=new flower(); 
/*根据刚才原型的定义,实例obj必然复制自new flower();*/ 
obj=new flowe2(); 
/*从父类继承的属性*/ 
alert(obj.name); //==>"nokia" 
alert(obj.age); //==>22

一个构造器产生的实例,其constructor属性默认总是指向该构造器
alert(obj.constructor);//==>flower
构造器原型的constructor属性 指向构造器本身
alert(flower.prototype.constructor==flower);//==>true
constructor会与原型继承发生的冲突
function flower(){} 
function flower2(){} 
flower2.prototype=new flower(); 
var obj1=new flower(); 
var obj2=new flower2(); 
/*问题出现了,2个实例的constructor属性都指向flower*/ 
alert(obj1.constructor==obj2.constructor); 
/*obj1和obj2是不同的构造器产生的实例,缺指向相同的构造器,显然出了问题*/

解决的方法
flower2.prototype=new flower(); 
/*重置原型后,修改原型的constructor属性*/ 
flower2.prototype.constructor=flower2 
或每次构造实例时都重写constructor属性 
function flower2(){ 
this.constructor=arguments.callee; 
} 
flower2.prototype=new flower();

此外原型继承没有提供调用父类的方法
然而我们基于原型继承,通过静态变量记录父类来弥补这一缺陷
var Class={ 
create:function() 
{ 
var _class=function() 
{ 
this.init.apply(this,arguments); 
} 
_class.prototype.init=Function.prototype.init; 
try{ 
return _class; 
}finally{ 
_class=null; 
} 
} 
}; 
//默认构造函数 
Function.prototype.init=function(){} 
//方法扩展 
Function.prototype.extend=function(list) 
{ 
for(var i in list)this.prototype[i]=list[i]; 
return this; 
} 
//多级继承 
Function.prototype.inherits=function(parent) 
{ 
//继承的深度级别 
var _depth=0; 
//方法属性移植 
this.extend(new parent()); 
//初始化构造函数 类的继承通常不继承构造函数 
this.prototype.init=Function.prototype.init; 
//类的静态父类 
this.parent=parent; 
//执行父类函数 
this.prototype.parent=function(name) 
{ 
//若没有参数则执行构造函数 
if(!name)name='init'; 
//即将执行的父类 
var _parent=parent; 
//若当前已经在父类中执行则继续向上寻找超类 
if(_depth) 
{ 
for(var i=0;i<_depth;i++) 
{ 
_parent=_parent.parent; 
} 
} 
//设置好级别 
_depth++; 
try{ 
//执行函数并返回值 
return _parent.prototype[name].apply(this,Array.prototype.slice.apply(arguments,[1])); 
}catch(e){ 
throw(e); 
}finally{ 
//恢复级别 
_depth--; 
} 
} 
return this; 
}

例子:
//创建名为class1的构造器 
var class1=Class.create().extend({ 
b:function() 
{ 
alert('clas'); 
alert(this.c); 
}, 
c:100 
}); 
//创建"对象"(构造器)的实例 
var s=new class1(); 
s.b();// ==>"clas",100

继承父类,并调用父类的方法:
var test=Class.create().inherits(class1).extend({ 
b:function() 
{ 
alert('test'); 
this.parent('b') 
}, 
c:110 
});
Javascript 相关文章推荐
js window.onload 加载多个函数的方法
Nov 02 Javascript
用jquery实现自定义风格的滑动条实现代码
Apr 26 Javascript
jQuery级联操作绑定事件实例
Sep 02 Javascript
原生的html元素选择器类似jquery选择器
Oct 15 Javascript
60行js代码实现俄罗斯方块
Mar 31 Javascript
js仿微信语音播放实现思路
Dec 12 Javascript
es6 字符串String的扩展(实例讲解)
Aug 03 Javascript
JS对象与json字符串相互转换实现方法示例
Jun 14 Javascript
vue动画打包后失效问题的解决方法
Sep 18 Javascript
WebGL学习教程之Three.js学习笔记(第一篇)
Apr 25 Javascript
原生微信小程序开发中 redux 的使用详解
Feb 18 Javascript
javascript实现简单页面倒计时
Mar 02 Javascript
用js实现的自定义的对话框的实现代码
Mar 21 #Javascript
简洁短小的 JavaScript IE 浏览器判定代码
Mar 21 #Javascript
jQuery实现表单input中提示文字value随鼠标焦点移进移出而显示或隐藏的代码
Mar 21 #Javascript
锋利的jQuery jQuery中的DOM操作
Mar 21 #Javascript
锋利的jQuery 要点归纳(一) jQuery选择器
Mar 21 #Javascript
jquery 可拖拽的窗体控件实现代码
Mar 21 #Javascript
jquery实现的元素的left增加N像素 鼠标移开会慢慢的移动到原来的位置
Mar 21 #Javascript
You might like
几个学习PHP的网址
2006/11/25 PHP
Symfony实现行为和模板中取得request参数的方法
2016/03/17 PHP
PHP 7.1中AES加解密方法mcrypt_module_open()的替换方案
2017/10/17 PHP
PHP7 echo和print语句实例用法
2019/02/15 PHP
javascript document.referrer 用法
2009/04/30 Javascript
基于jquery创建的一个图片、视频缓冲的效果样式插件
2012/08/28 Javascript
使用jquery实现鼠标滑过弹出更多相关信息层附源码下载
2015/11/23 Javascript
javascript自动恢复文本框点击清除后的默认文本
2016/01/12 Javascript
浅析Javascript ES6新增值比较函数Object.is
2016/08/24 Javascript
bootstrap实现每隔5秒自动轮播效果
2016/12/20 Javascript
JavaScript和JQuery获取DIV值的方法示例
2017/03/07 Javascript
单行 JS 实现移动端金钱格式的输入规则
2017/05/22 Javascript
jquery.pagination.js分页使用教程
2018/10/23 jQuery
JS如何实现动态添加的元素绑定事件
2019/11/12 Javascript
Python高效编程技巧
2013/01/07 Python
Python 多进程和数据传递的理解
2017/10/09 Python
Python版名片管理系统
2018/11/30 Python
python2.7实现邮件发送功能
2018/12/12 Python
Python对HTML转义字符进行反转义的实现方法
2019/04/28 Python
Python实现FM算法解析
2019/06/18 Python
Pytorch: 自定义网络层实例
2020/01/07 Python
python Shapely使用指南详解
2020/02/18 Python
python ETL工具 pyetl
2020/06/07 Python
Python sklearn中的.fit与.predict的用法说明
2020/06/28 Python
中国宠物用品商城:E宠商城
2016/08/27 全球购物
会计实习期自我鉴定
2013/10/06 职场文书
大学生旷课检讨书
2014/01/22 职场文书
市场安全管理制度
2014/01/26 职场文书
2014年秋季开学寄语
2014/08/02 职场文书
镇班子对照检查材料思想汇报
2014/09/24 职场文书
单方离婚协议书范本2014
2014/10/28 职场文书
党的群众路线教育实践活动心得体会(教师)
2014/10/31 职场文书
2015年银行个人工作总结
2015/05/14 职场文书
大学生创业计划书常用模板
2019/08/07 职场文书
Python-OpenCV教程之图像的位运算详解
2021/06/21 Python
详解Python+OpenCV绘制灰度直方图
2022/03/22 Python