没有 setTimeout 0 看不懂堆栈答案

【问题标题】：Don't understand the stack without the setTimeout 0没有 setTimeout 0 看不懂堆栈
【发布时间】：2018-03-03 09:09:43
【问题描述】：

我对堆栈和 setTimeout 0 有疑问。上面的代码产生了所需的输出，但我不明白为什么不将超时设置为 0 “....计算”不会输出。因为我认为即使没有超时，堆栈上也会“....计算”然后转到函数 countUp 和 for 循环，如果完成了，那么就会写成“准备再次计算” 但是为什么没有 setTimeout 0 就不会发生这种情况呢？

function countUp() {
    var result;
    for (var i = 0; i < 1000000000; i++) {
        result = i;
    }
    document.getElementById('status').innerText = 'Ready To Calculate Again';
}

function callback() {
    document.getElementById('status').innerText = '...calculating';
    var wait = window.setTimeout(function() {
        countUp();
    }, 0);
}

document.getElementById('button').addEventListener('click', callback);

【问题讨论】：

不太确定您要做什么。 countUp() 中的 for() 循环只是从 0 循环到 1000000000 并将结果设置为当前增量，而您的 setTimeout() 设置为 0 毫秒。
我正要从您的代码创建一个可运行的 sn-p，但所有代码都显示“准备再次计算”，这与您的描述不符。所以我认为你应该编辑问题并自己创建 sn-p，可能有两个版本（因为你描述有两种不同的行为）。

标签： javascript stack settimeout

【解决方案1】：

浏览器在事件队列中的任务之间进行重排和重绘如果您在没有 setTimeout 的情况下调用 countUp，则将在回调任务范围内调用 countUp，因此在 countUp 完成后将在浏览器中重绘。因此，您将立即获得“...计算”和“准备再次计算”。但它们应该在不同的时间点显示。因此，为了允许浏览器进行重绘和显示...计算我们将 countUp 调用作为单独的任务与 setTimeout 一起放入事件队列中。

【讨论】：

非常感谢！这是我最近两天没有找到的答案！