javascript当中的代码嗅探扩展原生对象和原型(prototype)


Posted in Javascript onJanuary 11, 2013

:翻译之中有什么不恰当的地方,欢迎大家指正,祝大家双节快乐!
如果不是有特殊需要而去扩展原生对象和原型(prototype)的做法是不好的

//不要这样做 
Array.prototype.map = function() { 
// 一些代码 
};

除非这样做是值得的,例如,向一些旧的浏览器中添加一些ECMAScript5中的方法。
在这种情况下,我们一般这样做:
if (!Array.prototype.map) { 
Array.prototype.map = function() { 
//一些代码 
}; 
}

如果我们比较偏执,为了防止别人将map定义为其它意想不到的值,像true或其他,我们可以 将检测代码改为下面这样:
if (typeof Array.prototype.map !== "function") { 
Array.prototype.map = function() { 
// 一些代码 
}; 
}

(尽管这将破坏其它开发者的map定义,并影响他们功能的实现)
但是,在一个充满敌意和残酷竞争的环境下(换句话说,但你提供或者使用一个js库时),你不应该相信任何人。如果其他人的js代码先于你的js代码加载,并且以某种方式定义了一个不完全兼容ES5的map()方法,导致你的代码不能正常运行,该怎么办呢?

不过,你可以相信浏览器,如果Webkit内核实现了map()方法,你可以放心,这个方法肯定会正常运行。否则的话,你就要用你的代码进行检测了。

幸运的是,这在JavaScript当中很容易实现,当你调用原生函数的toString方法的时候,会返回一个函数的字符串,该函数的函数体是[native code]。
例如在Chrome的控制台下:

> Array.prototype.map.toString(); 
"function map() { [native code] }"

一个适当的代码检查向来就是一个稍微令人不快的事,因为不同浏览器对空格和换行处理的太过轻率。测试如下:
Array.prototype.map.toString().replace(/\s/g, '*'); 
// "*function*map()*{*****[native*code]*}*" // IE 
// "function*map()*{*****[native*code]*}" // FF 
// "function*map()*{*[native*code]*}" // Chrome

只简单的去掉\s会得到更实用的字符串:
Array.prototype.map.toString().replace(/\s/g, ''); 
// "functionmap(){[nativecode]}"

你可以将它封装成一个可以重用的shim()函数,这样以来你就没有必要去重复所有的类似!

Array.prototype...这样的操作了。这个函数会接受一个对象作为参数(例如,Array.prototype),一个将要添加的属性(例如 'map')和一个要添加的函数。

function shim(o, prop, fn) { 
var nbody = "function" + prop + "(){[nativecode]}"; 
if (o.hasOwnProperty(prop) && 
o[prop].toString().replace(/\s/g, '') === nbody) { 
//表名是原生的! 
return true; 
} 
//新添加的 
o[prop] = fn; 
}

测试:
//这是原生的方法 
shim( 
Array.prototype, 'map', 
function(){/*...*/} 
); // true 
//这是新添加的方法 
shim( 
Array.prototype, 'mapzer', 
function(){alert(this)} 
); 
[1,2,3].mapzer(); // alerts 1,2,3

(完)^_^
Javascript 相关文章推荐
List Information About the Binary Files Used by an Application
Jun 11 Javascript
关于URL中的特殊符号使用介绍
Nov 03 Javascript
精彩的Bootstrap案例分享 重点在注释!(选项卡、栅格布局)
Jul 01 Javascript
JavaScript基础知识点归纳(推荐)
Jul 09 Javascript
jQuery 自定义下拉框(DropDown)附源码下载
Jul 22 Javascript
JavaScript 继承详解(六)
Oct 11 Javascript
jquery+css实现侧边导航栏效果
Jun 12 jQuery
vue-cli + sass 的正确打开方式图文详解
Oct 27 Javascript
vue input输入框关键字筛选检索列表数据展示
Oct 26 Javascript
微信小程序获取用户信息及手机号(后端TP5.0)
Sep 12 Javascript
一文读懂vue动态属性数据绑定(v-bind指令)
Jul 20 Javascript
基于Ionic3实现选项卡切换并重新加载echarts
Sep 24 Javascript
关于JavaScript的面向对象和继承有利新手学习
Jan 11 #Javascript
不用构造函数(Constructor)new关键字也能实现JavaScript的面向对象
Jan 11 #Javascript
javascript使用中为什么10..toString()正常而10.toString()出错呢
Jan 11 #Javascript
javascript将数组插入到另一个数组中的代码
Jan 10 #Javascript
jquery实现点击TreeView文本父节点展开/折叠子节点
Jan 10 #Javascript
javascript 中String.match()与RegExp.exec()的区别说明
Jan 10 #Javascript
防止文件缓存的js代码
Jan 10 #Javascript
You might like
PHP结合Mysql数据库实现留言板功能
2016/03/04 PHP
JQuery 确定css方框模型(盒模型Box Model)
2010/01/22 Javascript
博客侧边栏模块跟随滚动条滑动固定效果的实现方法(js+jquery等)
2013/03/24 Javascript
探讨JQUERY JSON的反序列化类 using问题的解决方法
2013/12/19 Javascript
关闭ie窗口清除Session的解决方法
2014/01/10 Javascript
JS烟花背景效果实现方法
2015/03/03 Javascript
关于JSON.parse(),JSON.stringify(),jQuery.parseJSON()的用法
2016/06/30 Javascript
easyui datagrid 大数据加载效率慢,优化解决方法(推荐)
2016/11/09 Javascript
node.js中实现kindEditor图片上传功能的方法教程
2017/04/26 Javascript
jQuery+C#实现参数RSA加密传输功能【附jsencrypt.js下载】
2017/06/26 jQuery
基于jQuery封装的分页组件
2017/06/26 jQuery
关于TypeScript中import JSON的正确姿势详解
2017/07/25 Javascript
小程序云开发实战小结
2018/10/25 Javascript
node.js实现为PDF添加水印的示例代码
2018/12/05 Javascript
vue中node_modules中第三方模块的修改使用详解
2019/05/31 Javascript
Vue.js递归组件实现组织架构树和选人功能
2019/07/04 Javascript
解决layer弹出层的内容页点击按钮跳转到新的页面问题
2019/09/14 Javascript
eslint+prettier统一代码风格的实现方法
2020/07/22 Javascript
简单理解Python中基于生成器的状态机
2015/04/13 Python
Python常用的文件及文件路径、目录操作方法汇总介绍
2015/05/21 Python
使用Python解析JSON数据的基本方法
2015/10/15 Python
Python开发的实用计算器完整实例
2017/05/10 Python
Python中用psycopg2模块操作PostgreSQL方法
2017/11/28 Python
python 实现一次性在文件中写入多行的方法
2019/01/28 Python
Python检测数据类型的方法总结
2019/05/20 Python
详解python 破解网站反爬虫的两种简单方法
2020/02/09 Python
Bibloo奥地利:购买女装、男装、童装、鞋和配件
2018/10/18 全球购物
统计每一学生的平均成绩
2014/06/06 面试题
成人毕业生自我鉴定
2013/10/18 职场文书
高中自我鉴定范文
2013/11/03 职场文书
农民工工资支付承诺函
2014/03/31 职场文书
英文演讲稿开场白
2014/08/25 职场文书
合作协议书模板2014
2014/09/26 职场文书
医院岗前培训心得体会
2016/01/08 职场文书
求职信:求职应该注意的问题
2019/04/24 职场文书
使用Python开发贪吃蛇游戏 SnakeGame
2022/04/30 Python