在 JavaScript 中停止 setInterval 调用

在 JavaScript 中，我们经常使用 setInterval() 方法来定期执行一些代码。但是有时我们需要在某个时刻停止一个 setInterval() 调用，以避免代码继续执行。下面我们来介绍几种方法来停止 setInterval() 调用。

方法一：使用 clearInterval()

clearInterval() 是 JavaScript 中用来停止 setInterval() 调用的方法。它需要一个参数，即需要停止的 setInterval() 的 ID。以下是使用 setInterval() 和 clearInterval() 的示例代码：

// 每秒输出一次 "Hello World!"
var intervalID = setInterval(function() {
  console.log("Hello World!");
}, 1000);

// 5 秒后停止 setInterval
setTimeout(function() {
  clearInterval(intervalID);
}, 5000);

在上面的代码中，我们使用 setInterval() 方法来每秒输出一次 "Hello World!" 字符串。然后，我们使用 setTimeout() 方法来在 5 秒后调用 clearInterval() 方法来停止 setInterval() 调用。

方法二：重新赋值 setInterval()

另一种停止 setInterval() 调用的方法是重新赋值 setInterval() 的返回值变量。每次重新赋值时，就相当于停止了之前的 setInterval() 调用。以下是使用这种方法的示例代码：

// 每秒输出一次 "Hello World!"
var intervalID = setInterval(function() {
  console.log("Hello World!");
}, 1000);

// 5 秒后停止 setInterval
setTimeout(function() {
  intervalID = null;
}, 5000);

在上面的代码中，我们先使用 setInterval() 方法来每秒输出一次 "Hello World!" 字符串。然后，在 5 秒后，我们将 intervalID 变量的值设置为 null，相当于停止了 setInterval() 调用。

方法三：使用闭包

最后一种停止 setInterval() 调用的方法是使用闭包。在闭包中，我们可以访问父级函数中的变量，从而在父级函数中停止 setInterval() 调用。以下是使用闭包的示例代码：

// 每秒输出一次 "Hello World!"
var stopInterval = (function() {
  var intervalID = setInterval(function() {
    console.log("Hello World!");
  }, 1000);

  return function() {
    clearInterval(intervalID);
  }
})();

// 5 秒后停止 setInterval
setTimeout(function() {
  stopInterval();
}, 5000);

在上面的代码中，我们定义了一个闭包，其中包含了 setInterval() 方法所返回的 ID 号。然后，我们在闭包中返回了一个匿名函数，该函数使用 clearInterval() 方法在父级作用域中停止了 setInterval() 调用。最后，我们在外部调用了这个返回的函数来停止 setInterval() 调用。