javascript - 关于匿名函数和调用/应用/绑定(bind)的执行上下文

Question

我正在尝试深入了解并理解而不是反省代码。我知道绑定(bind)、调用和应用通过修改this指向的内容来更改执行上下文。我不明白的是，这些方法在哪些领域是不可或缺的和/或导致代码更短。考虑以下几点:

var person = {
            firstName: 'john',
            lastName: 'doe',
            fullName: function () {
                console.log(this.firstName + " " + this.lastName);
            }
        }
//#1, binder is an html button
$('#binder').click(person.fullName.bind(person)); //john doe

//#2, anonymous is an html button
$('#anonymous').click(function () {
    person.fullName(); //john doe
});

//seems strange I see this application a lot 'borrowing' a method
//why?
var o = { firstName: 'obj', lastName: 'ect' };
person.fullName.call(o); //obj ect to console

我想知道一些关于何时使用 call 和 apply 是良好实践和/或节省大量时间的一般范例(以及在不使用匿名函数之外绑定(bind)函数 #1)

Answer 1

我想说的是，要重点关注这些功能中的每一个都是不可或缺的

• apply 在处理可变参数函数时最有用。它允许您将值数组转换为参数列表。

  function logwrapper(f){
    return function(){
      console.log("called");
      return f.apply(this, arguments);
    }
  }
  
  var bar = function(){ ... }
  var foo = logwrapper(bar);
  

当您想要将方法传递到某些只需要函数的代码时，

• bind 最有用。一个常见的例子是 settimeout 和其他需要回调的函数:

  setTimeout(function(){ obj.meth(); }, 100); //handwritten callback
  
  setTimeout(obj.meth.bind(obj), 100);        //Function.prototype.bind
  
  setTimeout(bind(obj, "meth"), 100);         //Some JS libraries have functions that
                                              //let you write the object only once.
  

  请记住，IE <=8 不支持 native Function.prototype.bind。在这种情况下，您可能需要使用 polyfill 或辅助库。

• call 对于借用方法最有用，正如您已经注意到的那样。这是否有用很大程度上取决于您的特定用例，但一个非常常见的重要用途是在参数上使用数组方法。由于历史原因，arguments 没有任何常用的数组方法(切片、映射等)，因此您需要借用它们:

  function myvariadic(x){
     var rest = [].slice.call(x, 1);
  }
  

  您可能会看到的另一个示例是 hasOwnProerty 方法:

  for(k in obj){
     if(Object.prototype.hasOwnProperty.call(obj, k)){
        ....
     }
  }
  

  这使您可以调用真正的 hasOwnProperty 方法，即使对象使用自己的 hasOwnProperty 键隐藏它。