使用Ajax请求承诺for循环

时间:2016-04-16 12:37:26

标签: ajax loops es6-promise

我正在创建一个本机JavaScript应用程序,它在特定时间在同一进程中执行大量Ajax调用。我没有通过正常的for循环而是一次完成所有操作,而是认为我等待Ajax调用完成然后再完成下一个调用。

在Stackoverflow的帮助下,我设法完成了以下操作:

function ajaxCall(index) {
    return new Promise(function(resolve) {
        // Ajax request {
            resolve();
        // }
   });
}

Promise.resolve(0).then(function loop(i) {
    if (i < length) {
        return ajaxCall(i).thenReturn(i + 1).then(loop);
    }
}).then(function() {
    // for loop complete
});


Promise.prototype.thenReturn = function(value) {
    return this.then(function() {
        return value; 
    });
};

然而,这对我来说太慢了。我希望能够保留一个var来跟踪当前进程中有多少Ajax调用,以便我可以限制数量。

我已经尝试过多种方法,但是我一直遇到无限循环或没有达到预期效果。

如何使用Promise for循环执行多个(受特定数量限制)异步Ajax调用?

1 个答案:

答案 0 :(得分:0)

听起来你想要一个Promise.all版本,它需要一系列异步函数而不是promises,以及同时操作数量的上限。类似的东西:

&#13;
&#13;
Promise.allFuncs = (funcs, n) => {
  n = Math.min(n, funcs.length);
  var results = [];
  var doFunc = i => funcs[i]().then(result => {
    results[i] = result; // store result at the correct offset
    if (n < funcs.length) {
      return doFunc(n++);
    }
  });
  // start only n simultaneous chains
  return Promise.all(funcs.slice(0, n).map((p, i) => doFunc(i)))
    .then(() => results); // final result
};

// --- Example: ---

var log = msg => div.innerHTML += msg + "<br>";
var wait = ms => new Promise(resolve => setTimeout(resolve, ms));

var example = ['a','b','c','d','e','f'].map(name =>
  () => (log("started "+name),wait(2000).then(() => (log("ended "+ name), name))));
  
Promise.allFuncs(example, 2)
.then(results => log("Results: "+ results))
.catch(log);
&#13;
<div id="div"></div>
&#13;
&#13;
&#13;