首页 > 解决方案 > 我如何让javascript循环等待循环的每次迭代完成,然后再开始下一次?

问题描述

我有一个循环迭代 1000 次,每次迭代发出一个请求,然后打印该请求的结果。

类似于下面。

let start = console.log(Date.now())
for (i = 0; i < 1000; i++) {
    request.then(data => {
        console.log(Date.now() - start)
    })
}

然而,这导致第一个请求需要更长的时间才能完成,如果只有 1 次循环迭代。

i < 1000:

5860
...

i < 1:

220,
...

然而,为了这个脚本的目的,我想在开始循环的下一次迭代之前等待收到每个结果。

标签: javascriptloopsrequest

解决方案


如果你想坚持 ES5 处理 Promises 的方式,你可以使用以下方法:

const start = console.log(Date.now())

// Create a instantly resolved promise
for (let i = 0, p = Promise.resolve(); i < 1000; i++) {
  // append new promise to the chain
  p = p.then(() => request()
       .then(() => console.log(Date.now() - start));
}

如果您可以使用 ES6 方法,则可以使用如下async/await模式编写:

const asyncLoop = async () => {
  const start = console.log(Date.now())

  for (let i = 0; i < 1000; i++) {
    const data = await request();
    console.log(Date.now() - start);
  }
}

asyncLoop();

虽然你真的想要一个接一个地发出请求的机会实际上很小,所以如果你想同时发出请求,但在所有请求都解决后做一些事情,你可以使用Promise.all(...)

const start = console.log(Date.now())
const requests = [request1, request2, ...];

Promise.all(requests)
       .then(() => console.log(Date.now() - start));

推荐阅读