具有异步函数的JavaScript数组

Question

我在JavaScript中有一个字符串数组.该数组的定义如下:

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

我需要循环遍历数组并调用异步运行的函数.该函数如下所示:

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

我正在尝试迭代我的数组中的所有项目,并找出运行所有项目需要多长时间.我想做这样的事情:

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

显然,上面的方法不起作用,因为在移动到数组中的下一个项目之前,它不会等待ajax调用完成.我知道我需要使用回调.但是,我不知道如何以这种方式构建我的代码.我该怎么做呢？

Answer 1

使用 Promise 并执行如下操作：

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

我还没有测试过，但我认为它可以通过一些适应很好地工作:)
我认为带有计数器的解决方案在某些条件下可能会失败。

编辑：它有效http://jsfiddle.net/0u21jwxv/