如何在Javascript中延迟setInterval？

我现在在 JavaScript 中反复遇到一个奇怪的问题。我似乎无法拖延setInterval longer.

发生情况的一个小例子：

var loop;
var count;
loop = setInterval(start, 30);

function start() {
    //Some code

    delay();

    //Some more code
}

function delay() {
    setTimeout(function () {
        count++;

        //Animation code

        if (count <= 1000) delay();
    }, 100);
}

现在我想做的是，执行“一些代码”部分，在“动画代码”执行时不执行任何操作，然后执行“更多代码”部分。

发生的情况是“更多代码”部分和延迟函数同时执行。我努力了clearInterval(loop)在调用延迟函数并在延迟函数完成执行后重新启动它之前，但“更多代码”似乎无论如何都会执行一次。

我该如何解决这个问题？请结合例子给出详细的解释。

Your delay()功能实际上并没有阻止你start()功能完成。

在 JavaScript 中，setTimeout()不会暂停 Javascript 的执行。相反，它所做的是安排传递给的回调setTimeout()在将来的某个时候运行，而其余的代码将继续运行。

如果你想延迟某个代码块的执行一段时间，那么你必须将该代码块放在setTimeout()像这样的回调：

setTimeout(function() {
    // the code in here will run some time in the future
}, delayTime);

// the code here will run immediately

Javascript 中经常描述的方式是调用setTimeout()是非阻塞的。它不会停止或暂停当前执行线程的运行。事实上，执行线程将运行至完成。反而，setTimeout()安排在将来的特定时间（当没有其他 Javascript 代码运行时）调用回调函数。

因为 Javascript 是单线程的，所以几乎永远不会循环尝试创建延迟，即使你使用很长的while()环形。问题是，当您循环时，没有其他 Javascript 代码可以运行，因此其他状态都不能更改，因此您等待更改的任何循环条件在循环时都不会更改。这通常只会导致死锁类型的情况，最终浏览器意识到 Javascript 线程“卡住”并提示中止它。

相反，您可以使用事件和未来的回调进行编程。您设置一个事件或计时器回调，以便在将来发生某些情况时可以调用它，然后将相关代码放入该回调或事件处理程序中。还有更高级的工具可以帮助管理此问题，例如 Promise 或异步库，但它们只是构建在相同的回调机制之上。