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 相关文章推荐
lib.utf.js
Aug 21 Javascript
网页打开自动最大化的js代码
Aug 22 Javascript
纯js实现遮罩层效果原理分析
May 27 Javascript
jquery实现保存已选用户
Jul 21 Javascript
JS封装的选项卡TAB切换效果示例
Sep 20 Javascript
vue2滚动条加载更多数据实现代码
Jan 10 Javascript
详解如何使用node.js的开发框架express创建一个web应用
Dec 20 Javascript
Javascript之高级数组API的使用实例
Mar 08 Javascript
javascript+HTML5 canvas绘制时钟功能示例
May 15 Javascript
实例讲解JavaScript 计时事件
Jul 04 Javascript
js实现贪吃蛇游戏(简易版)
Sep 29 Javascript
微信小程序实现底部弹出模态框
Nov 18 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
中国广播史趣谈 — 几个历史第一次
2021/03/01 无线电
php var_export与var_dump 输出的不同
2013/08/09 PHP
php session劫持和防范的方法
2013/11/12 PHP
php判断文件上传类型及过滤不安全数据的方法
2014/12/17 PHP
js中几种去掉字串左右空格的方法
2006/12/25 Javascript
jquery 插件学习(六)
2012/08/06 Javascript
基于jquery实现的省市区级联无ajax
2013/09/24 Javascript
node.js解决获取图片真实文件类型的问题
2014/12/20 Javascript
jQuery解析XML文件同时动态增加js文件的方法
2015/06/01 Javascript
jQuery 插件实现随机自由弹跳气泡样式
2017/01/12 Javascript
微信小程序之拖拽排序(代码分享)
2017/01/21 Javascript
微信小程序实现图片自适应(支持多图)
2017/01/25 Javascript
jQuery移除或禁用html元素点击事件常用方法小结
2017/02/10 Javascript
jQuery控制元素隐藏和显示
2017/03/03 Javascript
详解Vue2.x-directive的学习笔记
2017/07/17 Javascript
基于jQuery的$.getScript方法去加载javaScript文档解析
2017/11/08 jQuery
spirngmvc js传递复杂json参数到controller的实例
2018/03/29 Javascript
详解Vue-cli中的静态资源管理(src/assets和static/的区别)
2018/06/19 Javascript
js实现的格式化数字和金额功能简单示例
2019/07/30 Javascript
Python正则表达式教程之二:捕获篇
2017/03/02 Python
Python实现桶排序与快速排序算法结合应用示例
2017/11/22 Python
python自动发送邮件脚本
2018/06/20 Python
python读取txt文件并取其某一列数据的示例
2019/02/19 Python
tesserocr与pytesseract模块的使用方法解析
2019/08/30 Python
ubuntu上安装python的实例方法
2019/09/30 Python
Elasticsearch py客户端库安装及使用方法解析
2020/09/14 Python
基于python爬取链家二手房信息代码示例
2020/10/21 Python
CSS3实现曲线阴影和翘边阴影
2016/05/03 HTML / CSS
化工工艺专业求职信
2013/09/22 职场文书
工程类专业自荐信范文
2014/03/09 职场文书
教师年度考核评语
2014/04/28 职场文书
教师民族团结演讲稿
2014/08/27 职场文书
基层组织建设年活动总结
2015/05/09 职场文书
2015年中秋晚会主持词
2015/07/01 职场文书
保护环境建议书作文500字
2015/09/14 职场文书
Nginx+Tomcat负载均衡集群的实现示例
2021/10/24 Servers