javascript - 负载过大时 typescript 异步功能不起作用

Question

假设我有这个模块:

export async function beFancy () {
  let i, j, load;
  // just for trying to delay the return;
  for (i = 0; i < 999; ++i) {
    for (j = 0; j < 999; ++j) {
      load = i + j;
    }
  }
  return 'beFancy finished';
}

现在我制作一个用于测试的主模块:

import {beFancy} from './mymodule';

beFancy().then((msg) => console.log(msg));
console.log('main finished');

如果我执行，输出符合预期

-> main finished
-> beFancy finished

因为 beFancy 是-asynchronous-

但现在如果我尝试让循环更激烈一些:

export async function beFancy() {
  let i, j, load;
  for (i = 0; i < 9999999; ++i) {
    for (j = 0; j < 999; ++j) {
      load = i + j;
    }
  }
  return 'beFancy finished';
}

再次执行main，输出是一样的

-> main finished
-> beFancy finished

但我希望 main finished 在函数 beFancy 实际被处理之前显示。相反，当 beFancy 完成时，上面的输出会一次性显示。起初我认为原因是因为输出只在程序结束时刷新但是如果我输入:

console.log('begin');
beFancy().then((msg) => console.log(msg));
console.log('main finished');

在“beFancy”执行之前显示“begin”，因此不满足我之前的假设。

因为 beFancy 是异步的，所以可能有什么问题？这是我机器上的意外行为吗？

Answer 1

So because beFancy is -asynchronous- what could possibly be wrong ?

那是因为只有 beFancy 返回值是异步的。 beFancy 大部分是同步的，会阻塞主线程。上面的代码大致相同:

  function beFancy () {
    return new Promise(resolve => {
      let i, j, load;
      for (i = 0; i < 999; ++i) {
        for (j = 0; j < 999; ++j) {
          load = i + j;
        }
      }
      console.log('logged on same tick')
      resolve('logged on next tick');
    });
  }

  console.log('begin');
  beFancy().then((msg) => console.log(msg));
  console.log('main finished');

为了使 async 函数中的循环是异步和非阻塞的，它应该使用 await 分块执行:

export async function beFancy () {
  let i, j, load;
  for (i = 0; i < 999; ++i) {
    await null; // next tick
    for (j = 0; j < 999; ++j) {
      load = i + j;
    }
  }
  return 'beFancy finished';
}