javascript 面向对象编程基础 多态


Posted in Javascript onAugust 21, 2009

Javascript已经可以模拟出面向对象的封装和继承特性,但是不幸的是Javascript对多态特性的支持非常弱!其它面向对象语言的多态一般都由方法重载和虚方法来实现多态,Javascript也通过这两种途径来实现!

重载:由于Javascript是弱类型的语言,而且又支持可变参数,当我们定义重载方法的时候,解释器无法通过参数类型和参数个数来区分不同的重载方法,因此方法重载是不被支持的!当先后定义了同名的方法的时候,后定义的方法会覆盖先定义的方法!

既然解释器无法分辨重载方法,那就手动区分不同的方法:

var MyClass=function(){ 
var AddNum=function(a,b){ 
return a+b; 
} 
var AddString=function(a,b){ 
return "I am here"+a+b; 
} 
this.Add=function(a,b){ 
if(typeof(a)=="number") 
return AddNum(a,b); 
else 
return AddString(a,b); 
} 
} 
var MyObj = new MyClass(); 
var X = MyObj.Add(5,6); 
var Y = MyObj.Add("A","FFFFFF"); 
alert(X); //结果:11 
alert(Y); //结果:I am hereAFFFFFF

虚方法:
function BaseClass(){ 
this.Hello=function(){ 
return this.Say(); 
} 
} 
function MyClassA(){ 
this.Say=function(){ 
return "Hello"; 
} 
} 
function MyClassB(){ 
this.Say=function(){ 
return "This is MyClassB"; 
} 
} 
MyClassA.prototype = new BaseClass(); 
MyClassB.prototype = new BaseClass(); 
var ObjA = new MyClassA(); 
var XX = ObjA.Hello(); 
alert(XX); //结果:Hello 
var ObjB = new MyClassB(); 
var YY = ObjB.Hello(); 
alert(YY); //结果:This is MyClassB

由于Javascript解释执行的特性,因此可以再基类中调用将要在派生类中定义的方法,那么这个基类方法就相当于虚方法,可以实现模拟多态!
js的重载和重写(覆写):
重载的意思是,“同一个名字的函数(注意这里包括函数)或方法可以有多个实现,它们依靠参数的类型和(或)参数的个数来区分识别”。而重写(覆盖)的意思是,“子类中可以定义与父类中同名,并且参数类型和个数也相同的方法,这些方法的定义后,在子类的实例化对象中,父类中继承的这些同名方法将被隐藏”。重载的英文是overload,覆盖的英文是override。好了,概念介绍到这里,你猜到我要说什么了吗?嘿嘿,Code is cheap.看重载代码:
// 通过函数的arguments属性实现重载 
function add() { 
var sum = 0 ; 
for ( var i = 0 ; i < arguments.length; i ++ ) { 
sum += arguments[i]; 
} 
return sum; 
} 
function test() { 
alert(add()); 
alert(add( 1 , 2 )); 
alert(add( 1 , 2 , 3 )); 
}

通过代码运行结果,这样就实现了任意多个参数加法函数的重载了。当然,你还可以在函数中通过 instanceof 或者 constructor 来判断每个参数的类型,来决定后面执行什么操作,实现更为复杂的函数或方法重载。总之,javascript 的重载,是在函数中由用户自己通过操作 arguments 这个属性来实现的。关于arguments的特性,前面我已经做了简单介绍,参考拙文:http://blog.csdn.net/zhanglingdll_39/archive/2009/08/20/4465670.aspx 。
下面重点理解js重写的实现:
// 为类添加静态方法inherit表示继承于某类
Function.prototype.inherit = function (baseClass) {
for ( var p in baseClass.prototype) {
this .prototype[p] = baseClass.prototype[p];
}
}
// js实现重写
function parentClass() { // 父类
}
parentClass.prototype.method = function () {
alert( " parentClass method " );
}
function subClass() { // 子类
}
//
下面这一句和subClass.prototype = new parentClass();等价 
subClass.inherit(parentClass); 
// subClass.prototype.method = function() { // 子类重写了父类的方法 -- 去掉注释运行试试看 
// alert("subClass method"); 
// } 
function test() { 
var obj = new subClass(); 
obj.method(); 
} 
这样,子类中定义的method 就覆盖了从父类中继承来的method 方法了。这是你可能会问,如何在子类中调用父类的method方法呢?好的,看实现如下: 
// 为类添加静态方法inherit表示继承于某类 
Function.prototype.inherit = function (baseClass) { 
for ( var p in baseClass.prototype) { 
this .prototype[p] = baseClass.prototype[p]; 
} 
} 
/* 参考文章:http://menjoy.javaeye.com/blog/127847 */ 
// js实现重写 
function parentClass() { 
this .method = function () { 
alert( " parentClass method " ); 
} 
} 
function subClass() { 
var method = this .method; 
this .method = function () { 
method.call( this ); 
alert( " subClass method " ); 
} 
} 
subClass.prototype = new parentClass(); 
// subClass.inherit(parentClass); //这一句貌似和上一句subClass.prototype = new parentClass();等价,其实呢????(注释上一行,运行这一行看看) 
subClass.prototype.constructor = subClass; 
function test() { 
var obj = new subClass(); 
obj.method(); 
}

好了,关于多态的介绍就到这里。js面向对象编程犹如浩瀚海洋广阔无边,我这三篇参考别人的文章写出来的js面向对象基础只能当作入门者学习的参考。学无止境,参考了网上几篇老大们的牛文,深知自身技术的浅薄,对于已经超越了解阶段的读者,还是看看园子里高人的技术文章吧。我这里要先拜谢园子里的高人了。
Javascript 相关文章推荐
js静态作用域的功能。
Dec 25 Javascript
List Information About the Binary Files Used by an Application
Jun 18 Javascript
增强用户体验友好性之jquery easyui window 窗口关闭时的提示
Jun 22 Javascript
select、radio表单回显功能实现避免使用jquery载入赋值
Jun 08 Javascript
js在输入框屏蔽按键,只能键入数字的示例代码
Jan 03 Javascript
json对象与数组以及转换成js对象的简单实现方法
Jun 24 Javascript
Vue.js双向绑定实现原理详解
Dec 22 Javascript
微信小程序canvas写字板效果及实例
Jun 15 Javascript
Swiper实现轮播图效果
Jul 03 Javascript
微信小程序实现图片上传、删除和预览功能的方法
Dec 18 Javascript
vue-lazyload使用总结(推荐)
Nov 01 Javascript
通过循环优化 JavaScript 程序
Jun 24 Javascript
javascript 面向对象编程基础:继承
Aug 21 #Javascript
javascript 面向对象编程基础:封装
Aug 21 #Javascript
javascript arguments 传递给函数的隐含参数
Aug 21 #Javascript
javascript 自定义事件初探
Aug 21 #Javascript
IE 下的只读 innerHTML
Aug 21 #Javascript
JS 控制CSS样式表
Aug 20 #Javascript
JS获取父节点方法
Aug 20 #Javascript
You might like
星际争霸中的对战模式介绍
2020/03/04 星际争霸
php 分页类 扩展代码
2009/06/11 PHP
PHP 防恶意刷新实现代码
2010/05/16 PHP
php如何解决无法上传大于8M的文件问题
2014/03/10 PHP
非常好用的Zend Framework分页类
2014/06/25 PHP
Zend Framework教程之Application和Bootstrap用法详解
2016/03/10 PHP
25个非常棒的jQuery滑块插件和教程小结
2011/09/02 Javascript
js制作的鼠标悬浮时产生的下拉框效果
2012/10/27 Javascript
javascript基于DOM实现权限选择实例分析
2015/05/14 Javascript
微信小程序 教程之注册程序
2016/10/17 Javascript
JavaScript中如何使用cookie实现记住密码功能及cookie相关函数介绍
2016/11/10 Javascript
JavaScript实现公历转农历功能示例
2017/02/13 Javascript
原生js实现放大镜特效
2017/03/08 Javascript
JavaScript学习总结之正则的元字符和一些简单的应用
2017/06/30 Javascript
vue-cli3搭建项目的详细步骤
2018/12/05 Javascript
详解微信小程序实现跑马灯效果(附完整代码)
2019/04/29 Javascript
通过微信公众平台获取公众号文章的方法示例
2019/12/25 Javascript
JavaScript实现鼠标移入随机变换颜色
2020/11/24 Javascript
[01:03:37]Secret vs VGJ.S Supermajor小组赛C组 BO3 第二场 6.3
2018/06/04 DOTA
用python实现的去除win下文本文件头部BOM的代码
2013/02/10 Python
Python版微信红包分配算法
2015/05/04 Python
Python 实现「食行生鲜」签到领积分功能
2018/09/26 Python
python实现单链表中删除倒数第K个节点的方法
2018/09/28 Python
Django跨域请求CSRF的方法示例
2018/11/11 Python
Scrapy框架爬取西刺代理网免费高匿代理的实现代码
2019/02/22 Python
Python企业编码生成系统之系统主要函数设计详解
2019/07/26 Python
python实现证件照换底功能
2019/08/20 Python
Keras在训练期间可视化训练误差和测试误差实例
2020/06/16 Python
html5+css3之CSS中的布局与Header的实现
2014/11/21 HTML / CSS
html5 兼容IE6结构的实现代码
2012/05/14 HTML / CSS
改变生活的男士内衣:SAXX Underwear
2019/08/28 全球购物
英国历史最悠久的DJ设备供应商:DJ Finance、DJ Warehouse、The DJ Shop
2019/09/04 全球购物
优秀的教师个人的中文求职信
2013/09/21 职场文书
初中生期末评语大全
2014/04/24 职场文书
2014年环保工作总结
2014/11/26 职场文书
优秀党员先进材料
2014/12/18 职场文书