Javascript - 动态改变setTimeout/setInterval的间隔值

Question

谁能解释一下这段代码吗？

var checkinterval = 1;
var myFunction = function(){
    clearInterval(Interval2);
    console.log(checkinterval++);
    setInterval(myFunction, 5000);  
}
var Interval2 = setInterval(myFunction, 1000);

此代码正在调用其自己定义内的函数。即在 myFunction 中，有 setInterval(myFunction, 5000) 正在其自己的定义中调用该函数。这没有道理。

与clearInterval(Interval2)类似，变量Interval2在其自身定义之前被调用。

很抱歉，我只是这些计时器的新手。有人可以详细说明这些代码行吗？

Answer 1

据我了解:

当您将函数存储到“myFunction”变量时，它不会立即执行。它们只是被存储起来以供以后实际调用它们时使用。

这发生在以下行中:

var Interval2 = setInterval(myFunction, 1000);

它的作用是每 1 秒调用一次 myFunction。但是，在您的情况下，它仅执行 myFunction 一次，因为在 myFunction 中

clearInterval(Interval2)

line 将清除分配给 Interval2 变量的计时器。

但是代码并不止于此。在 myFunction 中，这一行:

setInterval(myFunction, 5000);

每 5 秒调用 myFunction，这会将 checkInterval 加 1 并将其输出到控制台。这就是导致您的浏览器崩溃的原因，因为如果您考虑一下:

第一次调用 myFunction:1 个 myFunction 实例将排队在接下来的 5 秒内运行(我们称之为 A)

5秒后...

执行 A，这会将 checkInterval 加 1，并将 myFunction 的另一个实例放入队列以在 5 秒内运行(将此称为 B)

5秒后...

执行 A，这会将 checkInterval 加 1，并将 myFunction 的另一个实例放入队列以在 5 秒内运行(将此称为 C)

执行 A，这会将 checkInterval 加 1，并将 myFunction 的另一个实例放入队列以在 5 秒内运行(将此称为 D)

5秒后...

A被执行... B被处决了... C被执行... D被执行...

你明白了。

本质上，这段代码的作用是每 5 秒执行一次的“myFunction”数量加倍。最终会有太多的程序需要运行，您的浏览器自然无法处理负载。

希望我的解释没有让你感到困惑。我会尽力澄清您可能有的任何疑问。