js实现内置计时器

当我们需要在网页中实现倒计时、循环播放等功能时，可以使用 JavaScript 中的内置计时器。下面是使用 setInterval 和 setTimeout 两种方式实现内置计时器的攻略。

使用 setInterval 实现内置计时器

使用 setInterval 函数可以设置定时器，让代码在指定时间间隔内重复执行。

具体做法如下：

1. 创建一个计时器变量，用于存储 setInterval 返回的计时器ID。

2. 调用 setInterval 函数，设置代码循环执行的时间间隔和要执行的代码 function。

3. 在代码执行过程中，可以通过 clearInterval 函数取消计时器。

示例代码如下：

let timer = null; // 计时器变量

function countDown() {
  let count = 60; // 倒计时时间
  timer = setInterval(() => {
    console.log(count);
    count--;
    if (count < 0) {
      clearInterval(timer);
      console.log('计时结束');
    }
  }, 1000); // 间隔1秒执行一次
}

countDown();

以上代码可以实现一个每隔1秒输出倒计时时间的定时器，并在倒计时结束时输出 "计时结束"。

使用 setTimeout 实现内置计时器

除了 setInterval，我们还可以使用 setTimeout 函数来实现内置计时器。

setTimeout 函数可以在指定的时间后执行一次指定的代码，可以通过递归调用 setTimeout 函数来实现循环执行某段代码。

具体做法如下：

1. 创建一个计时器变量，用于存储 setTimeout 返回的计时器ID。

2. 调用 setTimeout 函数，设置代码执行的时刻和要执行的代码 function。

3. 在代码执行过程中，可以通过 clearTimeout 函数取消计时器。

示例代码如下：

let timer = null; // 计时器变量

function countDown() {
  let count = 60; // 倒计时时间
  timer = setTimeout(() => {
    console.log(count);
    count--;
    if (count < 0) {
      console.log('计时结束');
    } else {
      countDown(); // 递归调用自身
    }
  }, 1000); // 间隔1秒执行一次
}

countDown();

以上代码可以实现一个倒计时计时器，它在每次输出倒计时时间之后，将剩余时间减1，在倒计时结束之前不断递归调用自身，以实现定时器的循环执行。

总的来说，使用 setInterval 和 setTimeout 都可以实现内置计时器，具体选择哪种方式取决于实际需求。需要注意的是，在使用定时器时一定要及时取消计时器，以免出现意外的结果。