2015-06-06 19 views
5

Ho una matrice di stringhe in JavaScript. La matrice è definita come la seguente:Array JavaScript con funzioni asincrone

var myArray = []; 
myArray.push('1'); 
myArray.push('2'); 
myArray.push('3'); 

Ho bisogno di scorrere l'array e chiamare una funzione che viene eseguita in modo asincrono. Tale funzione è simile al seguente:

function myAsyncFunction(id, callback) { 
    $.ajax({ 
    url: '/api/items', 
    data: { 'id':id }, 
    type: 'POST', 
    dataType: 'text', 
    success: function(result) { 
     if (callback) { 
     callback(); 
     } 
    }, error: function() { 
     if (callback) { 
     callback(); 
     } 
    } 
} 

Sto cercando di scorrere tutti gli elementi in mio allineamento e capire quanto tempo ci vuole per eseguire tutti loro. Voglio fare qualcosa di simile:

var startTime = new Date(); 
for (var i=0; i<myArray.length; i++) { 
    myAsyncFunction(myArray[i]); 
} 
var duration = new Date() - startTime; 

Ovviamente, quanto sopra non funziona perché non attendere la chiamata AJAX per terminare prima di passare al successivo elemento dell'array. So che ho bisogno di usare le callback. Tuttavia, non sono sicuro di come strutturare il mio codice in questo modo. Come faccio a fare questo?

+0

Se nessuna delle risposte lavorato o si trovano ad affrontare problemi, me lo faccia sapere, così posso aiutare – AmmarCSE

risposta

2

Usa Promessa e fare qualcosa di simile:

var myArray = [1, 2, 3]; 
var promises = []; 
var startTime = new Date(); 
var duration; 

for (var i = 0, len = myArray.length; i < len; i++) { 
    var def = $.Deferred(); 
    promises.push(def); 

    (function(i) { 
     $.ajax({ 
      url: '/api/items', 
      data: { 'id':myArray[i] }, 
      type: 'POST', 
      dataType: 'text' 
     }).done(function() { 
      promises[i].resolve(); 
     }); 
    })(i); 
} 

$.when.apply($, promises).done(function() { 
    duration = new Date() - startTime; 
    console.log(duration); 
}); 

non ho ancora testato, ma penso che si può lavorare bene con qualche adattamento :)
Penso che la soluzione con il contatore può fallire in determinate condizioni.

EDIT: funziona http://jsfiddle.net/0u21jwxv/

1

tenere traccia del numero di chiamate che si sta per fare

var callCount = myArray.length; 

Poi, nelle callback verificare se l'ultimo

success: function(result) { 
     callCount--; 
     if(callCount == 0){ 
      var duration = new Date() - startTime; 
     } 
} 
1

Provare a usare un counter per questo scopo. Una volta che il valore del contatore è 0, trovare la durata.

var startTime = new Date(); 
var counter = myArray.length; //COUNTER 
for (var i=0; i<myArray.length; i++) { 
    myAsyncFunction(myArray[i],function(){//Here you use the callback 
    counter--; 
    if(counter == 0){ 
    var duration = new Date() - startTime; 
    } 
    }); 
} 
Problemi correlati