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

 更新时间:2012年12月27日 09:22:14   作者:  
在 google 一番技术资料后,发现 firefox 原生支持一个 bind 方法,该方法很好的满足了我们的初衷,调用方法与 call 和 apply 一样,只是定义完成后,在后期调用时该方法才会执行,需要的朋友可以了解下
前端开发者应该很清楚 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 中的作用域与闭包

    这篇文章主要介绍了JavaScript中的作用域与闭包,JavaScript是一种具有函数优先的轻量级,解释型或即时编译型的编程语言,下文是更多相关介绍需要的小伙伴可以参考一下
    2022-05-05
  • Layer UI表格列日期格式化及取消自动填充日期的实现方法

    Layer UI表格列日期格式化及取消自动填充日期的实现方法

    这篇文章主要介绍了Layer UI表格列日期格式化及取消自动填充日期的实现方法,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-05-05
  • Openlayers3实现车辆轨迹回放功能

    Openlayers3实现车辆轨迹回放功能

    这篇文章主要介绍了Openlayers3实现车辆轨迹回放功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-09-09
  • bootstrap suggest下拉框使用详解

    bootstrap suggest下拉框使用详解

    这篇文章主要为大家详细介绍了bootstrap suggest js下拉框的使用方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-04-04
  • js实现适合新闻类图片的轮播效果

    js实现适合新闻类图片的轮播效果

    本文主要分享了js实现适合新闻类图片轮播效果的示例代码,具有一定的参考价值,下面跟着小编一起来看下吧
    2017-02-02
  • js实现网页检测是否安装了 Flash Player 插件

    js实现网页检测是否安装了 Flash Player 插件

    js实现网页检测是否安装了 Flash Player 插件...
    2007-08-08
  • 分享Typescript的13个基础语法

    分享Typescript的13个基础语法

    这篇文章主要分享了Typescript的14个基础语法,Typescript可以说是JavaScript的超集,在JS的基础上新增了许多语法特性,使得类型不再可以随意转换,能大大减少开发阶段的错误。
    2021-12-12
  • JS实现拼音(字母)匹配汉字(姓名)的示例代码

    JS实现拼音(字母)匹配汉字(姓名)的示例代码

    这篇文章主要为大家详细介绍了如何利用JavaScript实现拼音(字母)匹配(搜索)汉字(姓名)的效果,文中的示例代码讲解详细,感兴趣的可以了解一下
    2023-04-04
  • 微信小程序跳转外部链接的详细实现方法

    微信小程序跳转外部链接的详细实现方法

    写这个是因为最近小程序的一个需求需要从小程序跳转到客户的官网,或者其他外部报名链接,下面这篇文章主要给大家介绍了关于微信小程序跳转外部链接的详细实现方法,需要的朋友可以参考下
    2022-10-10
  • TypeScript 接口继承的具体使用

    TypeScript 接口继承的具体使用

    本文主要介绍了TypeScript 接口继承的具体使用,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-07-07

最新评论