JavaScript bind方法

 

在ECMAScript 5中新增了bind() 函数用于控制调用的作用域 。bind () 是基于函数进行调用的 ，用来确保函数是在指定的this值所在的上下文中调用的。 我们可以通过如下代码了解其功能：

    function SayHello() {

           this.show=function () {

               alert("hello")

           }

           document.οnclick= function () {

                 this.show();

           }.bind(this)

       }

           SayHello();

 

在document.onclick 方法中 this 原本指向 document对象，但是我们通过bind方法可以将外部this 传入方法内部，使其作用域发生更改 。 这样就会调用window下的show方法，达到我们想要的效果 。但是老版本的浏览器并不支持bind( )， 幸运的是我们可以手动实现bind方法的兼容  。 直接扩展相关对象的原型，这样就可以在任意浏览器中使用它了 。

      // 若Function原型上不存在bind方法

      if(!Function.prototype.bind)

      {

          // 重新定义bind 方法

          Function.prototype.bind=function(obj) {

              var slice = [].slice,

              args =slice.call(arguments,1),   //获取后边的的参数,从bind 方法的第2参数个开始，同时转换为真正的数组 .

              self = this,   //  缓存变量 ,this 指当前调用bind方法的函数

              nop = function () {}, // 做代理函数，方法传递

              bound = function () {

                  // 若this指向的是当前所在函数，则继续使用this，否则使用传递进来的obj 做上下文替换 .

                  return self.apply(thisinstanceof nop ? this:(obj||{}),

                   args.concat(slice.call(arguments)));

              };

              nop.prototype = self.prototype;

              bound.prototype = new nop();

              return bound ;

          }