时间戳

首页 > 解决方案 > 如何等到 Javascript forEach 循环完成后再继续下一个 sep

javascript - 如何等到 Javascript forEach 循环完成后再继续下一个 sep

问题描述

在我调用另一个函数来重新加载应该由 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()完成，然后再运行 reload in function3()。

我曾尝试同时制作function1()和function2() async/await单独使用，但没有奏效。我将如何具体执行此操作？

标签： javascriptasynchronousforeachasync-awaitaxios

解决方案

创建一组承诺，然后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');
}

推荐阅读