为JavaScript类型增加方法的实现代码(增加功能)


Posted in Javascript onDecember 29, 2011

javaScript的类型函数(如Number/String/Boolean/Array/Date/Obejct等)都是继承于 Function.prototype,所以给Function.prototype增加方法,同时也会影响到由它衍生的下层类型函数。如:

Function.prototype.addMethod=function(methodName,func){ 
if(!this[methodName]){ 
this[methodName]=func;//给类型增加方法,类似于类型的静态方法。func方法是赋于了类型而非实例。 
} 
return this;//this 将绑定到方法的调用对象(类型函数),返回this可以进行链式调用 
} 
Array.addMethod('testFun',function(){alert(this)}); 
//Array.testFun(); //function Array() {[native code]} 
Object.addMethod('testFun',function(){alert(this)}); 
//Object.testFun(); //function Object() {[native code]} 
Boolean.addMethod('testFun',function(){alert(this)}); 
//Boolean.testFun(); //function Boolean() {[native code]} 
function CustomObject(name,value){ 
this.name=name || 'CustomObject'; 
this.value=value || 0; 
this.toString=function(){return '[name:'+this.name+',value:'+this.value+']'} 
} 
CustomObject.addMethod('testFun',function(){alert(this)}); 
/* return: 
* function CustomObject(name, value) { 
this.name = name || "CustomObject"; 
this.value = value || 0; 
this.toString = function () {return "[name:" + this.name + ",value:" + this.value + "]";}; 
} 
*/ 
CustomObject.testFun();

此时如果用实例来调用的话,则会报错。如:
var customObject=new CustomObject(); //定义一个CustomObject实例 
customObject.testFun();//Error: temp.testFun is not a function

给实例增加方法
如果给类型实例增加方法,则应该把方法绑定到类型的prototype上。如
Function.prototype.addMethod=function(methodName,func){ 
if(!this.prototype[methodName]){ 
this.prototype[methodName]=func;//给原型增加方法,此方法会影响到该类型的实例上 
} 
return this.prototype;//返回原型,此类型实例可以进行链形调用 
} 
Object.addMethod('testFun',function(){alert(this)}); 
//({toString:function(){return '[Empty Object]'}}).testFun(); //[Empty Object] 
Number.addMethod('testFun',function(){alert(this)}); 
//(5).testFun(); //5 
String.addMethod('testFun',function(){alert(this)}); 
//'test'.testFun(); //'test' 
Boolean.addMethod('testFun',function(){alert(this)}); 
//true.testFun(); //true 
Array.addMethod('testFun',function(){alert(this)}); 
//(['a','b']).testFun(); //a,b 
Date.addMethod('testFun',function(){alert(this)}); 
//new Date().testFun(); //Tue Dec 27 2011 11:20:58 GMT-0800 (Pacific Standard Time) 
function CustomObject(name,value){ 
this.name=name || 'CustomObject'; 
this.value=value || 0; 
this.toString=function(){return '[name:'+this.name+',value:'+this.value+']'} 
} 
CustomObject.addMethod('testFun',function(){alert(this)}); 
var customObject=new CustomObject(); 
customObject.testFun(); //[name:CustomObject,value:0]

若此时用类型调用testFun,则会报错。如
Array.addMethod('testFun',function(){alert(this)}); 
//Array.testFun(); //Error: Array.testFun is not a function 
CustomObject.addMethod('testFun',function(){alert(this)}); 
CustomObject.testFun(); //Error: CustomObject.testFun is not a function
Javascript 相关文章推荐
javascript下给元素添加事件的方法与代码
Aug 13 Javascript
jQueryUI的Dialog的简单封装
Jun 07 Javascript
浅谈javascript函数式编程
Sep 06 Javascript
谈谈我对JavaScript DOM事件的理解
Dec 18 Javascript
jQuery模仿阿里云购买服务器选择购买时间长度的代码
Apr 29 Javascript
js图片切换具体实现代码
Oct 13 Javascript
WEB前端实现裁剪上传图片功能
Oct 17 Javascript
Angularjs通过指令监听ng-repeat渲染完成后执行脚本的方法
Dec 31 Javascript
JS实现百度网盘任意文件强制下载功能
Aug 31 Javascript
JS控制GIF图片的停止与显示
Oct 24 Javascript
JS实现旋转木马轮播图
Jan 01 Javascript
element-ui树形控件后台返回的数据+生成组织树的工具类
Mar 05 Javascript
javaScript 利用闭包模拟对象的私有属性
Dec 29 #Javascript
Jquery中删除元素的实现代码
Dec 29 #Javascript
js的表单操作 简单计算器
Dec 29 #Javascript
javascript写的简单的计算器,内容很多,方法实用,推荐
Dec 29 #Javascript
JavaScript中两个感叹号的作用说明
Dec 28 #Javascript
javascript (用setTimeout而非setInterval)
Dec 28 #Javascript
js字符编码函数区别分析
Dec 28 #Javascript
You might like
15个小时----从修改程序到自己些程序
2006/10/09 PHP
浅谈php中mysql与mysqli的区别分析
2013/06/10 PHP
php旋转图片90度的方法
2013/11/07 PHP
thinkphp视图模型查询提示ERR: 1146:Table 'db.pr_order_view' doesn't exist的解决方法
2014/10/30 PHP
jquery 屏蔽一个区域内的所有元素,禁止输入
2009/10/22 Javascript
JS记录用户登录次数实现代码
2014/01/15 Javascript
深入浅出分析javaScript中this用法
2015/05/09 Javascript
前端js弹出框组件使用方法
2020/08/24 Javascript
微信小程序 详解Page中data数据操作和函数调用
2017/01/12 Javascript
关于vue.js发布后路径引用的问题解决
2017/08/15 Javascript
vue-router 实现导航守卫(路由卫士)的实例代码
2018/09/02 Javascript
js使用Promise实现简单的Ajax缓存
2018/11/14 Javascript
浅谈JS的原型和继承
2019/05/08 Javascript
微信小程序sessionid不一致问题解决
2019/08/30 Javascript
vue进入页面时不在顶部,检测滚动返回顶部按钮问题及解决方法
2019/10/30 Javascript
JS实现关闭小广告特效
2021/01/29 Javascript
js实现自动播放匀速轮播图
2020/02/06 Javascript
小程序实现列表倒计时功能
2021/01/29 Javascript
使用IPython下的Net-SNMP来管理类UNIX系统的教程
2015/04/15 Python
python中sleep函数用法实例分析
2015/04/29 Python
Python的标准模块包json详解
2017/03/13 Python
Python字符串格式化的方法(两种)
2017/09/19 Python
Python对多属性的重复数据去重实例
2018/04/18 Python
PyQt5每天必学之像素图控件QPixmap
2018/04/19 Python
pandas多级分组实现排序的方法
2018/04/20 Python
python二维列表一维列表的互相转换实例
2018/07/02 Python
使用python 打开文件并做匹配处理的实例
2019/01/02 Python
Django 重写用户模型的实现
2019/07/29 Python
python在协程中增加任务实例操作
2021/02/28 Python
法国家具及室内配件店:home24
2017/01/21 全球购物
啤酒销售实习自我鉴定
2013/09/24 职场文书
求职简历中自我评价
2014/01/28 职场文书
企业贷款委托书格式
2014/09/12 职场文书
安徽导游词
2015/02/12 职场文书
安全承诺书格式范本
2015/04/28 职场文书
Html5大屏数据可视化开发的实现
2021/06/11 HTML / CSS