如何遍歷異步作業數組，並分別執行它們？

Question

有工作上的一個陣列，說「要求用戶填寫表單」，「問題一個Ajax請求」等

我需要運行這些工作一個接一個，最後調用complete()方法。

喜歡的東西：

var jobs = [11, 22, 33, 44, ...]; 

for(var i = 0; i < jobs.length; i++) { 
    alert('Starting job #' + i); 

    // chooseJobOperator shows a form and wait for user to <select> a member 
    // and click save <button> 
    async(chooseJobOperator(jobs[i])); 

    alert('Job #' + i + ' is done, now for-loop will continue'); 
} 

alert('All jobs are done now.'); 
complete(); 

當我的工作是例如顯示prompt()我不需要做任何事情，因爲提示是同步的方法，但對於異步方法？

使用jQuery.Deffered可以這麼做嗎？

Answer 1

你可以試試這個

var jobs = [11, 12, 14, 15]; 
function doTheJob() { 
    if (jobs.length === 0) { 
     alert('All jobs are done now.'); 
     complete(); 
     return; 
    } 

    var job_Id = jobs.pop(); 
    $.ajax({ 
     url: "/DoTheJob", 
     complete: function() { 
      doTheJob(); 
     } 
    }); 
}; 

Answer 2

也許有更好的辦法，但我會用$.when這個函數。下面是它如何看起來的一個例子：

var jobs = [1, 2, 3]; 

var d = $.Deferred(), 
    stack = []; 

for (var i = 0; i < jobs.length; i++) { 
    stack.push(async(jobs[i])); 
} 

$.when.apply($, stack).done(function() { 
    alert('All done'); 
}); 

function async(type) { 
    alert('Starting job #' + type); 
    return $.Deferred(function() { 
     var self = this; 
     setTimeout(function() { 
      alert('Job #' + type + ' is done'); 
      self.resolve(); 
     }, 1000 * type); 
    }); 
} 

我用setTimeout作爲異步操作。

http://jsfiddle.net/rs3Qv/1/