setTimeout & clearTimeout 实现 setInterval & clearInterval

setInterval 和 clearInterval 是 JavaScript 内置函数，用于在指定的时间间隔内重复执行代码块。但有时我们可能需要实现类似的功能，却不想直接使用 setInterval 和 clearInterval，这时我们可以使用 setTimeout 和 clearTimeout 函数来实现它们。

首先，让我们看一下 setTimeout 函数。setTimeout 函数接收两个参数：一个函数和一个数字。函数是我们想要执行的代码块，数字是执行函数之前的等待时间（以毫秒为单位）。当等待时间到了，setTimeout 函数就会执行该函数。

例如，以下代码使用 setTimeout 函数每秒输出 "Hello World"：

setTimeout(() => {
  console.log("Hello World");
}, 1000);

clearTimeout 函数用于取消 setTimeout 函数。clearTimeout 函数接收一个参数：一个超时ID。超时ID是 setTimeout 函数返回的一个唯一ID，可用于取消该setTimeout 函数。

例如，以下代码使用 clearTimeout 函数取消一个 setTimeout 函数：

const timeoutId = setTimeout(() => {
  console.log("Hello World");
}, 1000);

clearTimeout(timeoutId);

现在，我们知道了如何使用 setTimeout 和 clearTimeout 函数，就可以使用它们来实现 setInterval 和 clearInterval 函数了。

setInterval 函数接收两个参数：一个函数和一个数字。函数是我们想要执行的代码块，数字是执行函数的时间间隔（以毫秒为单位）。setInterval 函数会不断执行该函数，直到它被 clearInterval 函数取消。

例如，以下代码使用 setInterval 函数每秒输出 "Hello World"：

const intervalId = setInterval(() => {
  console.log("Hello World");
}, 1000);

clearInterval 函数用于取消 setInterval 函数。clearInterval 函数接收一个参数：一个间隔ID。间隔ID是 setInterval 函数返回的一个唯一ID，可用于取消该 setInterval 函数。

例如，以下代码使用 clearInterval 函数取消一个 setInterval 函数：

const intervalId = setInterval(() => {
  console.log("Hello World");
}, 1000);

clearInterval(intervalId);

我们也可以使用 setTimeout 和 clearTimeout 函数来实现 clearInterval 函数。以下代码使用 setTimeout 和 clearTimeout 函数来实现 clearInterval 函数：

function clearInterval(intervalId) {
  clearTimeout(intervalId);
}

这样，我们就成功地使用 setTimeout 和 clearTimeout 函数实现了 setInterval 和 clearInterval 函数。