可以直接用setinterval调用clearinterval吗？答案

【问题标题】：Can clearinterval be called directly with setinterval?可以直接用setinterval调用clearinterval吗？
【发布时间】：2020-03-15 12:15:15
【问题描述】：

您好互联网的强大人士:)

在玩一些 JS 时，我注意到我无法在 clearInterval(var) 中使用 setInterval(function, milliseconds) 的返回值。

const intervalId = setInterval(() => foo(), 500);
setTimeout(() => clearInterval(intervalId), 2000);

在此示例中，间隔每 500 毫秒调用一次方法 foo()。 2s 后，这将被嵌套在 setTimeout(function, milliseconds) 中的 clearInterval(intervalId) 停止。

setTimeout(() => clearInterval(setInterval(() => foo(), 500)), 2000);

与上例不同，这里没有使用变量来保存setInterval()的返回值。
然而它导致区间从未被调用/立即停止。
这对我来说似乎很奇怪（并且可能是一个错误？）。

有人可以给出意见/解释吗？
谢谢 :)

【问题讨论】：

在setTimeout 触发之前什么都不会发生，这意味着直到那时setInterval 才会被调用，而clearInterval() 会立即被调用。
哦，是的，这是最大的不同，完全没有注意到！

【解决方案1】：

是的，你可以设置一个间隔或超时，然后用超时/间隔的ID清除它 - 但是，这没有多大意义，因为这样间隔函数永远不会运行，因为间隔将立即清除。这就是这里发生的事情。如果您不希望立即清除间隔，则应将间隔 ID 存储在变量中（就像上面对 int 所做的那样）。

除了将区间 ID 存储在变量中之外，您还可以将区间 ID 传递给 IIFE，但这基本上是在做同样的事情 - 区间 ID 将存储在参数中而不是独立变量中。

const foo = () => console.log('foo');

(int => {
  setTimeout(() => {
    clearInterval(int);
  }, 2000);
})(setInterval(foo, 500));

我也推荐：

如果您的超时或间隔只是要调用一个函数，只需传递函数本身。无需将其包装在另一个中。例如，只要调用上下文无关紧要，您始终可以将 () => foo(); 替换为 foo();。
使用int 作为变量名可能会让那些使用其他语言并希望int 成为关键字而不是变量名的人感到困惑。也许改为intervalId？

【讨论】：