如何在 forEach 函数上执行异步等待 [重复]答案

【问题标题】：how to do async await on a forEach function [duplicate]如何在 forEach 函数上执行异步等待 [重复]
【发布时间】：2018-10-23 23:38:57
【问题描述】：

我是异步等待和承诺的初学者。我阅读了几篇文章并观看了一些教程视频，但我仍然无法完全理解它。所以我现在正在编写一个代码

}).then(function() {
  var responseArray = []
  [url1,url2,url3,url4].forEach((url)=>{
      makeRequest(url)
  }).then((response)=>{
      responseArray.push(response)
  })
  return responseArray
})

正如预期的那样，responseArray 返回为空。我需要让它等到每个 makerequest(url) 的所有响应都被推送到 responseArray。
这是我的尝试

}).then(function() {
      var responseArray = []
      [url1,url2,url3,url4].forEach((url)=>{
          async makeRequest(url)
      }).then((response)=>{
          await responseArray.push(response)
      })
      return responseArray
    })

谁能帮我解决这个问题？

【问题讨论】：

剩下的代码在哪里？您也需要外部承诺来正确重构它
异步等待 + Array.prototype.map(): .then(async () => ['url1', 'url2', 'url3', 'url4'].map(async url => await makeRequest(url)));

标签： javascript foreach promise async-await

【解决方案1】：

您需要将请求映射到一组承诺，然后使用Promise.all：

.then(async () => {
  const responseArray = await Promise.all(
    [url1, url2, url3, url4].map(makeRequest)
  );
})

这将并行执行所有请求（这通常是您想要的，除非您想限制带宽等）。

如果你想按顺序执行它们，有一个huge discussion on the best approach。

【讨论】：

是的，makeRequest 应该返回一个承诺。
超级成功！

【解决方案2】：

如果你使用forEach，你不能等待所有的承诺都得到解决。请改用for .. of：

}).then(async function() {
    var arr = ['url1', 'url2', 'url3', 'url4'];
    var responseArray = []; 
    for (url of arr) {
        cont response = await makeRequest(url);
        responseArray.push(response);
    }
    return responseArray;
});

或者，为了获得更好的性能，您可以使用 Promise.all 并行启动所有请求：

}).then(async function() {
    var arr = ['url1', 'url2', 'url3', 'url4'];
    var responseArray = await Promise.all(arr.map(function(url) {
        return makeRequest(url);
    }));
    return responseArray;
});

【讨论】：