Question

我知道有很多关于回调，范围和闭包的问题。如果这是重复，我会提前道歉。

我有一个每个循环调用一个执行多个异步操作然后发出回调的函数。当回调激发时，我正在失去范围（显然）。我所做的是将循环中的项传递给函数，然后我在回调中返回它，所以我有我需要的范围。这是最好的方法吗？我不是在找一些过于复杂的东西。我只是想确保我不会遇到任何“陷阱”。

function doSomething(varA, varB, self, callback) {
  // do a lot of ajax stuff
  callback(varA + varB, self);
}

$.each( $('.selected'), function(i, item) {
  doSomething('a', 'b', item, function(retVal, self) {
    // process retVal and self
  }
}

Answer 1

你所得到的一切看起来不错，但有一件事：使用$.each()代替.each()。试试这个：

$('.selected').each(function(i, item) {
  doSomething('a', 'b', item, function(retVal, self) {
    // process retVal and self
  }
}

Answer 2

如果你不需要 doSomething中的元素引用，你可以用这种稍微整洁的方式创建一个闭包：

function doSomething(varA, varB, callback) { // do a lot of ajax stuff callback(varA + varB); } $.each( $('.selected'), function() { var self = this; doSomething('a', 'b', function(retVal) { // process retVal and self } });

Answer 3

主要的“陷阱”人遇到ajax和循环试图在稍后执行的函数内重用迭代变量。例如

for (var i in col) {
  $.ajax({
    url: '...' + i + '.html',
    success: function() {
      console.log(i);  // Why is i different???
    }
  });
}

发生此“问题”是因为在所有i回调中共有success个实例。

在您的方案中，虽然每个“迭代”级别都有一个i。所以这个问题不会打击你。

Answer 4

由于在callback函数中定义了.each()，因此当您到达回调函数时，item仍在范围内。因此，如果doSomething()从不使用self，则无需传递它。您可以参考item：

function doSomething(varA, varB, callback) {  
  // do a lot of ajax stuff  
  callback(varA + varB);  
}  

$('.selected').each(function(i, item) {  
  doSomething('a', 'b', function(retVal) {  
    // process retVal and item
  });
});

现在，如果回调是在.each()之外定义的，那么你必须按照它的方式进行，将item传递给doSomething()：

function doSomething(varA, varB, self, callback) {  
  // do a lot of ajax stuff  
  callback(varA + varB, self);  
}  
function doSomethingCallback(retVal, self) {  
  // process retVal and item
}

$('.selected').each(function(i, item) {  
  doSomething('a', 'b', item, doSomethingCallback);
});

迭代期间的回调范围

4 个答案: