如何让代码等待for循环执行完毕后再继续运行？

Hey there! I’ve hit this exact problem more times than I can count—async operations inside loops are sneaky because they don’t block the loop from moving forward by default. Let’s walk through the most reliable ways to make sure your loop finishes completely before your code proceeds.

First, Let’s Understand the Problem #

Chances are your code looks something like this (I’ll use JavaScript since it’s the most common scenario for this issue):

function getResults() {
  const results = [];
  const dataToProcess = [1, 2, 3, 4];

  dataToProcess.forEach(item => {
    // Your slow async operation (API call, file read, etc.)
    slowAsyncTask(item).then(output => {
      results.push(output);
    });
  });

  // This returns before any async tasks finish—results is incomplete!
  return results;
}

The loop fires off all the async tasks, but doesn’t wait for them to finish. By the time you return the array, most (if not all) of the async work is still running in the background.

Solution 1: Use async/await with for...of (Sequential Execution) #

If your tasks need to run one after another (e.g., each depends on the previous result), this is the most straightforward fix. The for...of loop will wait for each await to resolve before moving to the next iteration:

async function getResults() {
  const results = [];
  const dataToProcess = [1, 2, 3, 4];

  for (const item of dataToProcess) {
    // Wait for the async task to finish before pushing to the array
    const output = await slowAsyncTask(item);
    results.push(output);
  }

  // Now results is fully populated!
  return results;
}

// Call it with await (inside another async function) or .then()
getResults().then(finalResults => {
  console.log(finalResults); // Correct, complete array
});

Solution 2: Use Promise.all (Parallel Execution) #

If your async tasks don’t depend on each other, use this method to run them all at once—it’s way faster than waiting sequentially. Promise.all waits for every promise in an array to resolve, then returns an array of results in the same order as the original promises:

async function getResults() {
  const dataToProcess = [1, 2, 3, 4];

  // Map each item to an async promise
  const taskPromises = dataToProcess.map(item => slowAsyncTask(item));

  // Wait for all promises to finish
  const results = await Promise.all(taskPromises);

  return results;
}

This cuts down on total execution time because all tasks run in parallel instead of one after another.

Why Regular for/forEach Doesn’t Work #

A regular for loop (like for (let i = 0; i < data.length; i++)) or forEach doesn’t respect await inside the loop body. They’ll iterate through all items immediately, firing off async tasks, but the loop itself won’t pause. That’s why your array is empty or incomplete when you return it.

Just remember: whichever method you choose, your outer function needs to be marked async, and you have to use await or .then() when calling it—you can’t get the final results synchronously!

内容的提问来源于stack exchange，提问作者nsayer