使用异步函数的JavaScript数组

5

我有一个 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调用完成。我知道我需要使用回调函数。但是,我不确定如何以这种方式构造我的代码。我该怎么做?

如果以上答案都无法解决问题,或者您遇到了困难,请告诉我,我会提供帮助。 - AmmarCSE
3个回答

2

使用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/


1
跟踪您将要进行的通话数量。
var callCount = myArray.length;

然后,在回调函数中检查是否为最后一个。
success: function(result) {
      callCount--;
      if(callCount == 0){
          var duration = new Date() - startTime;
      }
}

1
尝试使用计数器来实现此目的。一旦计数器值为0,找到持续时间
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;
   } 
  });  
}

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接