为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 相关文章推荐
ECMAScript 创建自己的js类库
Nov 22 Javascript
浅谈javascript语法和定时函数
May 03 Javascript
jQuery.deferred对象使用详解
Mar 18 Javascript
jQuery中数据缓存$.data的用法及源码完全解析
Apr 29 Javascript
jQuery EasyUI window窗口使用实例代码
Dec 25 jQuery
解决Layui选择全部,换页checkbox复选框重新勾选的问题方法
Aug 14 Javascript
从0到1构建vueSSR项目之路由的构建
Mar 07 Javascript
微信小程序自定义波浪组件使用方法详解
Sep 21 Javascript
JS实现滑动拼图验证功能完整示例
Mar 29 Javascript
Element实现表格嵌套、多个表格共用一个表头的方法
May 09 Javascript
js 数据类型判断的方法
Dec 03 Javascript
typescript编写微信小程序创建项目的方法
Jan 29 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
与数据库连接
2006/10/09 PHP
PHP程序级守护进程的实现与优化的使用概述
2013/05/02 PHP
php判断对象是派生自哪个类的方法
2015/06/20 PHP
php基础教程
2015/08/26 PHP
Symfony2使用第三方库Upload制作图片上传实例详解
2016/02/04 PHP
PHP中mysqli_get_server_version()的实例用法
2020/02/03 PHP
jquery中ajax学习笔记3
2011/10/16 Javascript
javascript实现汉字转拼音代码分享
2015/04/20 Javascript
Bootstrap教程JS插件弹出框学习笔记分享
2016/05/17 Javascript
JS与SQL方式随机生成高强度密码示例
2018/12/29 Javascript
js module大战
2019/04/19 Javascript
浅谈关于vue中scss公用的解决方案
2019/12/02 Javascript
python迭代器的使用方法实例
2013/11/21 Python
python同时给两个收件人发送邮件的方法
2015/04/30 Python
python计算一个序列的平均值的方法
2015/07/11 Python
Python中关键字nonlocal和global的声明与解析
2017/03/12 Python
python利用lxml读写xml格式的文件
2017/08/10 Python
关于python的list相关知识(推荐)
2017/08/30 Python
django实现用户登陆功能详解
2017/12/11 Python
Linux-ubuntu16.04 Python3.5配置OpenCV3.2的方法
2018/04/02 Python
Python判断以什么结尾以什么开头的实例
2018/10/27 Python
对python 通过ssh访问数据库的实例详解
2019/02/19 Python
python3中类的继承以及self和super的区别详解
2019/06/26 Python
python turtle库画一个方格和圆实例
2019/06/27 Python
基于Python实现ComicReaper漫画自动爬取脚本过程解析
2019/11/11 Python
pycharm 更改创建文件默认路径的操作
2020/02/15 Python
Tensorflow与Keras自适应使用显存方式
2020/06/22 Python
HTML5 drag和drop具体使用详解
2021/01/18 HTML / CSS
在线购买廉价折扣书籍和小说:BookOutlet.com
2018/02/19 全球购物
美国背景检查、公共记录和人物搜索网站:BeenVerified
2018/02/25 全球购物
开业庆典主持词
2014/03/21 职场文书
英语专业毕业生求职信
2014/05/24 职场文书
投标人廉洁自律承诺书
2014/05/26 职场文书
离婚协议书包括哪些内容
2014/10/16 职场文书
Spring Data JPA使用JPQL与原生SQL进行查询的操作
2021/06/15 Java/Android
Nginx设置HTTPS的方法步骤 443证书配置方法
2022/03/21 Servers