使用while循环配合setTimeout实现计时器报错崩溃该如何解决？

• 同步任务阻塞事件循环：JavaScript采用单线程执行模型，所有同步代码执行完毕前，setTimeout回调这类异步任务不会被调度执行。你代码中的while循环属于同步代码，durationInput的减1操作写在setTimeout回调中，回调永远没有执行机会，导致durationInput始终满足>0的条件，循环会无限创建setTimeout实例，最终占用大量内存引发崩溃。
• 闭包变量共享：就算回调可以正常执行，所有setTimeout的回调函数捕获的都是同一个durationInput变量引用，等1秒后所有回调集中触发时，拿到的都是循环结束后的最终值，无法实现逐秒递减的效果。

如果必须保留while+setTimeout的组合，可以在同步阶段按时间差一次性创建所有定时任务，同时通过闭包保存每一轮的数值，避免无限循环和变量共享问题：

function countdown(durationInput) {
    let current = durationInput
    while (current > 0) {
        // 立即执行函数创建独立作用域，保存当前的计数值
        ((count) => {
            setTimeout(() => {
                console.log(count)
            }, (durationInput - count + 1) * 1000)
        })(current)
        current--
    }
    // 最后输出倒计时结束的0值
    setTimeout(() => console.log(0), (durationInput + 1) * 1000)
}

如果可以调整循环逻辑，更节省性能的实现是采用递归调度setTimeout的方案，不需要一次性创建大量定时器：

function countdown(durationInput) {
    let current = durationInput
    function countStep() {
        console.log(current)
        current--
        if (current >= 0) {
            setTimeout(countStep, 1000)
        }
    }
    countStep()
}

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