Javascript 中函数绑定和闭包的区别？

Question

当我们需要使用当前上下文对象调用 javascript 函数时，我看到有两个选项，例如：

使用函数绑定
使用Javascript闭包

函数绑定示例

myProject.prototype.makeAjax = function() {
  $.get('http://www.example.com/todoItems', function success(items) {
   this.addItemsToList(items)
  }.bind(this));
}

JS 闭包示例

myProject.prototype.makeAjax = function() {
  var that = this;

  $.get('http://www.example.com/todoItems', function success(items) {
   that.addItemsToList(items)
  });
}

我想问：

两者哪个性能更好？
编写代码时应该首选哪个？

Answer 1

这可能有点取决于应该首选哪个。我倾向于使用后者（虽然实际上我更喜欢前者，但我们使用的一些第 3 方库限制了它）。我认为选择风格最重要的是保持一致。

关于 prototype.bind 的注意事项是它不受 IE8 及更低版本的支持，这可能会给您带来问题。

我认为在性能方面，我希望 bind 会稍微慢一点，因为您在其中调用了一个额外的函数，但这可能取决于浏览器优化。不过，当他们的网站恢复正常以回答这部分问题时，我会尝试整理一个 jsperf 示例。

更新

似乎 JSPerf 不会很快启动。这是我放在一起的片段，显示关闭速度更快（假设我做对了）。关闭速度略快 7 倍多。如果您运行打开控制台，您将看到计时。

var limit = 100000;

var a = {
   val: 0,
   do: function(i) { val = i; /* Actually do some work to ensure doesn't get optimised out */ }  
};

var b = {
   myFunc: function(callback) { callback(); /* Function that's going to change this keyword */}   
};



var start = +new Date();

   for(var i = 0; i < limit; i++) {
     b.myFunc(function() {
        this.do(i);
     }.bind(a));
   };

var end =  +new Date();
var diff = end - start;
console.log("bind took " + diff + " ms");

var start = +new Date();

   for(var i = 0; i < limit; i++) {
     var that = a;
     b.myFunc(function() {
        that.do(i);
     });
   };

var end =  +new Date();
var diff = end - start;

console.log("closured took " + diff + " ms");

Javascript 中函数绑定和闭包的区别？

Difference between Function Binding and Closure in Javascript?

javascript

closures

bind

function

函数绑定示例

JS 闭包示例