如何使JavaScript编写结果随时间变化（而不是瞬间）？

Question

我有一个程序，它写了很多如果结果。例如，这：

const a = prompt();
for(let i = 1; i < a; i ++) {
  console.log(i);
}

（不是实际代码）
所以当您键入一个大数字时，控制台中会有大量答案等待输入。所以，当它达到某个点时，内置浏览器编译器（Opera GX）就停止工作。我需要一些方法在计算后立即写出这些数字，希望不会浪费时间。我该怎么做？（让您知道，我的实际代码将结果放在“div”元素中）

Answer 1

JavaScript是单线程的。这意味着当循环运行时，事件无法处理，页面也不会响应。您可以使用递归setTimeout。这将把一个长时间运行的代码分解成由事件循环管理的许多小片段。

const a = prompt();
const container = document.getElementById('container');
const f = (() => {
  let i = 0;
  return () => {
    for (let j = 0; j < 1e9; ++j) {} // simulates long calculation 
    ++i;
    console.log(i);
    container.innerText += ' ' + i;
    if (i < a) setTimeout(f, 0);
  };
})();
setTimeout(f, 0);

<div id="container"></div>