ie支持function.bind()方法实现代码


Posted in Javascript onDecember 27, 2012

前端开发者应该很清楚 Javscript 脚本的 function 函数对象可以通过 call 或 apply 方法,使其改变内部作用域(this)所指向的对象,实现更多可扩展的功能开发。ie 原生支持 function 对象的 call 和 apply 方法,在 firefox 或其它浏览器下也得到支持,但是 call 和 apply 方法是立即作用并执行,例如:

var func = function () { 
alert(this); 
}.apply(window);

当脚本解析引擎执行到这段代码时,会立即弹出对话框并显示 object 字符串。我们的初衷是想定义 func 方法作用在 window 对象域上,并在后期调用时再执行,但是 call 和 apply 方法并不能满足我们的初衷,它们会立即得到执行。

在 google 一番技术资料后,发现 firefox 原生支持一个 bind 方法,该方法很好的满足了我们的初衷,调用方法与 call 和 apply 一样,只是定义完成后,在后期调用时该方法才会执行。但是这个 bind 方法只有在 ie10 版本的浏览器才得到原生支持,低于该版本的浏览器下执行时会得到一个 undefined 的错误提示。于是只好再次上网 google 解决方案,功夫不负有心人,我们在 firefox 的开发站找到了解决方案,那就是增加 property 原型使得所有浏览器都能支持 bind 方法,代码如下:

if (!Function.prototype.bind) { 
Function.prototype.bind = function (oThis) { 
if (typeof this !== "function") { 
// closest thing possible to the ECMAScript 5 internal IsCallable function 
throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable"); 
} 
var aArgs = Array.prototype.slice.call(arguments, 1), 
fToBind = this, 
fNOP = function () {}, 
fBound = function () { 
return fToBind.apply(this instanceof fNOP && oThis 
? this 
: oThis, 
aArgs.concat(Array.prototype.slice.call(arguments))); 
}; 
fNOP.prototype = this.prototype; 
fBound.prototype = new fNOP(); 
return fBound; 
}; 
}

看懂这段代码需要点功底,我只是知道如何拿来用,如果哪位大牛有兴趣能够介绍一下这段源码的原理,不胜感激,谢谢!

单纯不是什么态度,而是一种满足。

Javascript 相关文章推荐
javascript 节点遍历函数
Mar 28 Javascript
jquery中防刷IP流量软件影响统计的一点对策
Jul 10 Javascript
jQuery插件的写法分享
Jun 12 Javascript
JS动态添加与删除select中的Option对象(示例代码)
Dec 25 Javascript
JavaScript子窗口调用父窗口变量和函数的方法
Oct 09 Javascript
百度坐标(BD09)、国测局坐标(火星坐标,GCJ02)、和WGS84坐标系之间的转换
Feb 19 Javascript
JS实现页面载入时随机显示图片效果
Sep 07 Javascript
浅谈React 属性和状态的一些总结
Nov 21 Javascript
JavaScript实现元素滚动条到达一定位置循环追加内容
Dec 28 Javascript
详解vue+axios给开发环境和生产环境配置不同的接口地址
Aug 16 Javascript
element ui分页多选,翻页记忆的实例
Sep 03 Javascript
Vue+Node实现商品列表的分页、排序、筛选,添加购物车功能详解
Dec 07 Javascript
前后台交互过程中json格式如何解析以及如何生成
Dec 26 #Javascript
多个js与css文件的合并方法详细说明
Dec 26 #Javascript
JS打开图片另存为对话框实现代码
Dec 26 #Javascript
window.addEventListener来解决让一个js事件执行多个函数
Dec 26 #Javascript
js动态添加onload、onresize、onscroll事件(另类方法)
Dec 26 #Javascript
JSON为什么那样红为什么要用json(另有洞天)
Dec 26 #Javascript
JS操作Cookies包括(读取添加与删除)
Dec 26 #Javascript
You might like
PHP set_error_handler()函数使用详解(示例)
2013/11/12 PHP
PHP策略模式定义与用法示例
2017/07/27 PHP
php实现对短信验证码发送次数的限制实例讲解
2021/03/04 PHP
多个datatable共存造成多个表格的checkbox都被选中
2013/07/11 Javascript
jquery 中的each()跳出循环的语句
2014/05/23 Javascript
javascript中call apply 与 bind方法详解
2016/03/10 Javascript
JavaScript正则替换HTML标签功能示例
2017/03/02 Javascript
React Native第三方平台分享的实例(Android,IOS双平台)
2017/08/04 Javascript
js前端面试之同步与异步问题详解
2019/04/03 Javascript
nodejs 递归拷贝、读取目录下所有文件和目录
2019/07/18 NodeJs
详解Python中用于计算指数的exp()方法
2015/05/14 Python
Python 绘图和可视化详细介绍
2017/02/11 Python
numpy中以文本的方式存储以及读取数据方法
2018/06/04 Python
Python实现爬虫从网络上下载文档的实例代码
2018/06/13 Python
python创建文件备份的脚本
2018/09/11 Python
详解python实现数据归一化处理的方式:(0,1)标准化
2019/07/17 Python
Python 中的 import 机制之实现远程导入模块
2019/10/29 Python
python中删除某个元素的方法解析
2019/11/05 Python
python pprint模块中print()和pprint()两者的区别
2020/02/10 Python
html5的画布canvas——画出弧线、旋转的图形实例代码+效果图
2013/06/09 HTML / CSS
美国知名平价彩妆品牌:e.l.f. Cosmetics
2017/11/20 全球购物
新加坡最受追捧的体验平台:Hapz
2018/01/01 全球购物
手工制作的意大利礼服鞋:Ace Marks
2018/12/15 全球购物
Lucene推荐的分页方式是什么?
2015/12/07 面试题
一个大学生十年的职业规划
2014/01/17 职场文书
四川省传达学习贯彻党的群众路线教育实践活动总结大会精神新闻稿
2014/10/26 职场文书
倡议书的格式写法
2015/04/28 职场文书
2015年大学班主任工作总结
2015/04/30 职场文书
银行保安拾金不昧表扬稿
2015/05/05 职场文书
教师培训学习心得体会
2016/01/21 职场文书
小学作文指导之如何写人?
2019/07/08 职场文书
python实现三次密码验证的示例
2021/04/29 Python
解决Pytorch中关于model.eval的问题
2021/05/22 Python
python 判断文件或文件夹是否存在
2022/03/18 Python
Python必备技巧之字符数据操作详解
2022/03/23 Python
Python爬虫网络请求之代理服务器和动态Cookies
2022/04/12 Python