Come posso attendere l'insieme di funzioni di callback asincrone?

Ho un codice simile a questo in javascript:

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

Dopo che TUTTE quelle chiamate asincrone sono state fatte, voglio calcolare il minimo su tutti gli array.

Come posso aspettare per tutti loro?

La mia unica idea in questo momento è di avere un array di booleani chiamato done, e impostare done [i] su true nella ith funzione di callback, quindi dire while (non tutti sono finiti) {}

modifica: suppongo che una possibile, ma brutta soluzione, sarebbe quella di modificare l'array done in ogni callback, quindi chiamare un metodo se tutti gli altri done sono impostati da ogni callback, quindi l'ultimo callback da completare chiamerà il metodo continue.

Grazie in anticipo.

Non sei stato molto specifico con il tuo codice, quindi creerò uno scenario. Diciamo che hai 10 chiamate ajax e vuoi accumulare i risultati di quelle 10 chiamate ajax e poi quando hanno tutte completato vuoi fare qualcosa. Puoi farlo in questo modo accumulando i dati in un array e tenendo traccia di quando l'ultimo è finito:

Contatore manuale

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
        }
    });
}

Nota: la gestione degli errori è importante qui (non mostrata perché è specifica per come stai effettuando le chiamate ajax). Dovrai pensare a come gestirai il caso quando una chiamata ajax non viene mai completata, con un errore o si blocca per molto tempo o scade dopo molto tempo.

jQuery Promises

In aggiunta alla mia risposta nel 2014. In questi giorni, le promesse vengono spesso utilizzate per risolvere questo tipo di problema poiché jQuery $.ajax()restituisce già una promessa e $.when()ti farà sapere quando un gruppo di promesse sarà stato risolto e raccoglierà i risultati di ritorno per te:

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
});

Promesse standard ES6

Come specificato nella risposta di kba : se hai un ambiente con promesse native integrate (browser moderno o node.js o utilizzando babeljs transpile o utilizzando un polyfill di promesse), puoi utilizzare promesse specificate da ES6. Vedi questa tabella per il supporto del browser. Le promesse sono supportate praticamente in tutti i browser attuali, tranne IE.

Se doAjax()restituisce una promessa, puoi farlo:

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
});

Se devi trasformare un'operazione asincrona senza promessa in un'operazione che restituisce una promessa, puoi "prometterla" in questo modo:

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

E poi usa lo schema sopra:

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
});

Promesse di Bluebird

Se utilizzi una libreria più ricca di funzionalità come la libreria di promesse di Bluebird , ha alcune funzioni aggiuntive integrate per renderlo più semplice:

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

Check-in dal 2015: ora abbiamo promesse native nel browser più recente (Edge 12, Firefox 40, Chrome 43, Safari 8, Opera 32 e browser Android 4.4.4 e iOS Safari 8.4, ma non Internet Explorer, Opera Mini e versioni precedenti di Android).

Se vogliamo eseguire 10 azioni asincrone e ricevere una notifica quando sono terminate, possiamo utilizzare il nativo Promise.all, senza alcuna libreria esterna:

function asyncAction(i) {
    return new Promise(function(resolve, reject) {
        var result = calculateResult();
        if (result.hasError()) {
            return reject(result.error);
        }
        return resolve(result);
    });
}

var promises = [];
for (var i=0; i < 10; i++) {
    promises.push(asyncAction(i));
}

Promise.all(promises).then(function AcceptHandler(results) {
    handleResults(results),
}, function ErrorHandler(error) {
    handleError(error);
});

Puoi utilizzare l' oggetto Deferred di jQuery insieme al metodo when .

deferredArray = [];
forloop {
    deferred = new $.Deferred();
    ajaxCall(function() {
      deferred.resolve();
    }
    deferredArray.push(deferred);
}

$.when(deferredArray, function() {
  //this code is called after all the ajax calls are done
});

Puoi emularlo in questo modo:

  countDownLatch = {
     count: 0,
     check: function() {
         this.count--;
         if (this.count == 0) this.calculate();
     },
     calculate: function() {...}
  };

quindi ogni chiamata asincrona fa questo:

countDownLatch.count++;

mentre in ogni richiamo asincrono alla fine del metodo aggiungi questa riga:

countDownLatch.check();

In altre parole, emuli una funzionalità di blocco del conto alla rovescia.

Questo è il modo più pulito secondo me.

Prometti tutti

FetchAPI

(per qualche motivo Array.map non funziona all'interno delle funzioni .then per me. Ma puoi usare .forEach e [] .concat () o qualcosa di simile)

Promise.all([
  fetch('/user/4'),
  fetch('/user/5'),
  fetch('/user/6'),
  fetch('/user/7'),
  fetch('/user/8')
]).then(responses => {
  return responses.map(response => {response.json()})
}).then((values) => {
  console.log(values);
})

Usa una libreria del flusso di controllo come after

after.map(array, function (value, done) {
    // do something async
    setTimeout(function () {
        // do something with the value
        done(null, value * 2)
    }, 10)
}, function (err, mappedArray) {
    // all done, continue here
    console.log(mappedArray)
})