Question

我有很多代码可以执行以下操作，将回调绑定到this：

someMethod: function()
{
  this.doSomething({
    callback: function(a,b,c)
    {
      console.log(a);
      console.log(this.title);
    }.bind(this),
    otherData: [1,2,3,4],
    anotherOption: true
  });
}

title:'test',

我希望这更具可读性，并通过函数调用或类似方法封装我如何对此进行绑定...类似于以下伪代码（我知道它不会工作））：

someMethod: function()
{
  this.doSomething({
    callback: this.bind(a,b,c)
    {
      console.log(a);
      console.log(this.title);
    },
    otherData: [1,2,3,4],
    anotherOption: true
  });
},

title:'test',

无论如何将回调绑定到这个更具可读性的回调？请注意，上面的示例已经过简化 - 通常我可能会传入2个回调，以及其他选项。

Answer 1

就个人而言，我会创建回调方法然后分配它，我发现阅读不那么痛苦，如果需要，它还会给你一个函数的引用，例如在使用bind和事件处理程序时很有用（可以添加/删除它们，因为bind会返回一个函数。

someMethod: function() {

  var callback = function(a,b,c) {
    console.log(a);
    console.log(this.title);
  }.bind(this);

  this.doSomething({
    callback: callback 
  });
},

title:'test',

您根本不能使用bind，并且像许多JS方法一样使用参数，这是您回调的范围，因此基本上只是向对象scope: this添加新属性。理想情况下，回调应该使用call运行，它将范围作为第一个参数。

Answer 2

怎么样：

someMethod : function ()
{
    var that = this;
    this.doSomething({
        callback : function (a,b,c) {
            console.log(a);
            console.log(that);
        }
    });
}

如果您每次都在创建新功能，则无需.bind。局部变量在这里更合适。

Answer 3

我认为你也可以使用类似的东西：

 //...
 someMethod: function() {
  this.doSomething({
    boundTo: this, //<= here
    callback: function(a,b,c) {
      console.log(a);
      console.log(this.boundTo.title); //<= and here
    },
    otherData: [1,2,3,4],
    anotherOption: true
   })
  }
 // ...

或者这个（闭包）也应该起作用

someMethod: function() {
  this.doSomething({
    callback: function(self) {
                return function(a,b,c) {
                  console.log(a);
                  console.log(self.title);
                 }; 
              }(this),
    otherData: [1,2,3,4],
    anotherOption: true
   });
}

更清楚的方法将函数绑定到此？

3 个答案: