异步 Javascript：同时运行两个函数

Question

我正在努力提高我对异步 JavaScript 的理解。为此，我制作了一个可能需要很长时间才能完成的函数，这将完全阻止任何其他代码的执行。

为了测试这一点，函数计数。第一次调用从 1 到 10000000。第二次调用从 10 到 100。

代码

async function LongTask(from, to) {
    //Count up
    let myNum = from
    

    console.log(`counting from ${myNum} to ${to}`)

    while (myNum != to) {
        //console.log(`myNum: ${myNum}`);
        await myNum++;

    }
    console.log(`counting from ${from} to ${to} done!`);
}

//2 functions that take some time to finish
LongTask(1, 10000000);
LongTask(10, 100);

//Do unrelated stuff
console.log("Hello World!");

输出

counting from 1 to 10000000
counting from 10 to 100
Hello World!
counting from 10 to 100 done!
counting from 1 to 10000000 done!

我设法得到它，因为它更快，所以 10 到 100 将首先完成。但是，我在第 10 行 await myNum++; 收到一条警告说'await' 对此表达式的类型没有影响。删除 await 关键字会导致代码阻塞，因此函数的第 10 到 100 次调用将不得不等待更长的时间，不相关的 1 到 10000000 次调用在被调用之前完成。

我是否误解了异步 JavaScript 的工作原理，是否有更好的方法来确保 10 到 100 的调用首先完成？

Answer 1

您只能等待您的函数（以及每个 async 函数）返回的 Promise。您必须在某个时候 await 这两个承诺，以确保程序不会在承诺解决之前退出。

您可以使用 Promise.all() 等待多个承诺。我改变了你的例子来等待一个预定义的时间跨度来说明它是如何工作的，因为我然后确切地知道我期望一个函数何时完成。

(async() => {
  async function LongTask(ms) {
    console.log(`starting task that will take ${ms} milliseconds`)
    await waitFor(ms);
    console.log(`ended task that took ${ms} milliseconds`);
  }

  async function waitFor(ms) {
    return new Promise((resolve, reject) => setTimeout(() => resolve(), ms))
  };

  //2 functions that take some time to finish
  const start = new Date();
  console.log(`Calling both functions at ${start}`)
  const countToSmallNumberPromise = LongTask(4000);
  const countToLargeNumberPromise = LongTask(1000);

  //Do unrelated stuff
  console.log("Hello World!");
  // await both promises to make sure they finish before the program finishes
  await Promise.all([countToLargeNumberPromise, countToSmallNumberPromise])
  const end = new Date();
  // program will end after approx. 4 seconds (at least 4 seconds), so both functions actually run in parallel 
  // (that's actually not correct, there is no real parallelism here, as Node or your browser are single-threaded)
  // To be correct: they run concurrently, not in parallel.
  console.log(`Ending program at ${end}. Program ran for ${end - start} milliseconds`);
})();

仅供参考：Difference between concurrent and in parallel