如何等到 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/rejected

async 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() {

    const value = arr[index];

    function2(value).then(res => {

        answers.push(res);

    });

    index++;

    if (index < arr.length) {

        loop();

    }

})();

function3();

console.log(answers);