我如何等待一组异步回调函数？

Question

我的JavaScript代码如下所示：

forloop {
    //async call, returns an array to its callback
}

完成所有这些异步调用后，我想计算所有数组的最小值。

我怎么能等到他们所有人呢？

我现在唯一的想法是有一个布尔数组叫做done,并在第i个回调函数中将done[i]设置为true,然后说while（not all are done）{}

edit：我想一个可能的，但很难看的解决方案是在每个回调中编辑done数组，然后在每个回调中设置了所有其他done的情况下调用一个方法，这样最后一个要完成的回调将调用continuing方法。

提前道谢。

Answer 1

您的代码不是很具体，所以我将编一个场景。假设您有10个ajax调用，您想要累积这10个ajax调用的结果，然后当它们全部完成时，您想要做一些事情。您可以这样做,方法是将数据累加到数组中,并跟踪最后一个数据完成的时间：

手动计数器

var ajaxCallsRemaining = 10;
var returnedData = [];

for (var i = 0; i < 10; i++) {
    doAjax(whatever, function(response) {
        // success handler from the ajax call

        // save response
        returnedData.push(response);

        // see if we're done with the last ajax call
        --ajaxCallsRemaining;
        if (ajaxCallsRemaining <= 0) {
            // all data is here now
            // look through the returnedData and do whatever processing 
            // you want on it right here
        }
    });
}

注意：错误处理在这里很重要（没有显示，因为它特定于如何进行ajax调用）。您需要考虑如何处理当一个ajax调用从未完成时的情况，或者出现错误，或者长时间卡住，或者长时间后超时。

补充了我2014年的回答。现在，promise经常被用来解决这类问题，因为jQuery的$.ajax()已经返回了一个promise，而$.when()会让您知道一组promise何时全部解决，并为您收集返回结果：

var promises = [];
for (var i = 0; i < 10; i++) {
    promises.push($.ajax(...));
}
$.when.apply($, promises).then(function() {
    // returned data is in arguments[0][0], arguments[1][0], ... arguments[9][0]
    // you can process it here
}, function() {
    // error occurred
});

ES6标准promise

正如KBA的回答中所指定的：如果您有一个内置本机promise的环境（modern browser或Node.js或使用babeljs transpile或使用一个promisepolyfill），那么您可以使用ES6指定的promise。有关浏览器支持，请参阅下表。除了IE之外，几乎所有当前的浏览器都支持promise。

如果doajax()返回一个promise，那么您可以这样做：

var promises = [];
for (var i = 0; i < 10; i++) {
    promises.push(doAjax(...));
}
Promise.all(promises).then(function() {
    // returned data is in arguments[0], arguments[1], ... arguments[n]
    // you can process it here
}, function(err) {
    // error occurred
});

如果您需要将一个非promise异步操作转换为返回promise的异步操作，您可以像这样“promise”它：

function doAjax(...) {
    return new Promise(function(resolve, reject) {
        someAsyncOperation(..., function(err, result) {
            if (err) return reject(err);
            resolve(result);
        });
    });
}

然后使用上面的模式：

var promises = [];
for (var i = 0; i < 10; i++) {
    promises.push(doAjax(...));
}
Promise.all(promises).then(function() {
    // returned data is in arguments[0], arguments[1], ... arguments[n]
    // you can process it here
}, function(err) {
    // error occurred
});

如果您使用一个功能更丰富的库，比如Bluebird promise库，那么它还内置了一些额外的功能，使其更容易实现：

 var doAjax = Promise.promisify(someAsync);
 var someData = [...]
 Promise.map(someData, doAjax).then(function(results) {
     // all ajax results here
 }, function(err) {
     // some error here
 });