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

172 阅读 0 评论 114 点赞

我是靠谱客的博主幸福帽子，最近开发中收集的这篇文章主要介绍ie支持function.bind()方法实现代码，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

前端开发者应该很清楚 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; 
}; 
} 