如何等到 Javascript forEach 循环完成后再进行下一个 sep

Question

在调用另一个函数来重新加载应由 axios 调用更新的数据之前，我需要等待由 forEach 循环调用的函数中的所有 axios 调用运行。

function1() {

    let arr = [1, 2, 3, 4, 5];

    arr.forEach((num) => {

        function2(num);

    });

    //Wait until each call in the forEach loop above

    //is done before running the function3() function.

    function3();

}

function2(number) {

    axios.post('/internal-url/action/' + number)

        .then((response) => {

            return response;

        });

}

function3() {

    console.log('reloading data...');

    /* DB call to reload data */

    console.log('data is reloaded');

}

这里的问题是数据在 axios 调用完成之前重新加载。我知道 axios 调用有效，因为我可以看到它们在数据库中更新，但我需要function1()等待所有 axios 调用function2()完成，然后才能在function3().

我曾尝试同时创建function1()和function2() async/await运行，然后单独运行，但这不起作用。我将如何具体执行此操作？

Answer 1

创建一个承诺数组，然后Promise.all使用async/await.// async/await - create an array of promises// from function2, then await until Promise.all has// fully resolved/rejectedasync function1() {  let arr = [1, 2, 3, 4, 5];  const promises = arr.map((num) => function2(num));  await Promise.all(promises);  function3();}function2(number) {  return axios.post('/internal-url/action/' + number);}function3() {  console.log('reloading data...');  /* DB call to reload data */  console.log('data is reloaded');}

Answer 2

最好的解决方案是使用，Promise.all以便所有请求都可以并行进行。这看起来像这样。function1() {    let arr = [1, 2, 3, 4, 5];    Promise.all(arr.map((num) => function2(num))).then(() => {        function3();    });}这将等到所有function2返回的 Promise都已解决，然后再调用function3.

Answer 3

也许是这样的：const arr = [1, 2, 3, 4, 5];let index = 0;const answers = [];(function loop() {&nbsp; &nbsp; const value = arr[index];&nbsp; &nbsp; function2(value).then(res => {&nbsp; &nbsp; &nbsp; &nbsp; answers.push(res);&nbsp; &nbsp; });&nbsp; &nbsp; index++;&nbsp; &nbsp; if (index < arr.length) {&nbsp; &nbsp; &nbsp; &nbsp; loop();&nbsp; &nbsp; }})();function3();console.log(answers);