js中定时器和计时器

1. 定时器 (Timers)

定时器主要用于在指定的时间间隔后执行某个函数或代码段。在JavaScript中，我们通常使用 setTimeout() 和 setInterval() 方法来创建定时器。

• setTimeout()：这个方法用于在指定的毫秒数后执行一次函数或代码段。它返回一个代表定时器的ID，这个ID可以用于之后清除定时器。
• setInterval()：这个方法用于每隔指定的毫秒数重复执行函数或代码段。同样，它也返回一个代表定时器的ID。

使用定时器时，要注意的一点是，它们并不会阻塞代码的执行。也就是说，当定时器被设置后，JavaScript会继续执行后续的代码，而不是等待定时器的触发。

1. 计时器 (Timers as Counters)

虽然“计时器”这个词在JavaScript的上下文中经常与定时器混淆使用，但严格来说，JavaScript本身并没有一个专门的“计时器”功能。然而，我们可以使用定时器（特别是 setInterval()）配合一些变量来模拟一个计时器的行为。

例如，你可以使用 setInterval() 来每秒更新一个变量的值，从而模拟一个秒表或倒计时器。这种情况下，虽然你使用的是定时器，但实际上你是在实现一个计时器的功能。

1. 清除定时器和计时器

对于使用 setTimeout() 或 setInterval() 创建的定时器，你可以使用 clearTimeout() 或 clearInterval() 方法来清除它们。这在你需要提前停止定时器的执行时非常有用。

总结：JavaScript中的定时器和计时器并不是同一个概念。定时器是一种用于在指定时间后或定期执行代码的机制，而计时器更像是一个概念，指的是通过某种方式（可能是定时器）来跟踪和更新时间的功能。在实际应用中，我们可能会使用定时器来实现计时器的功能。

let changeNumber: any = ref<string>('1');//定义初始值

let timer; // 声明一个定时器

//每五秒初始值加一
const setTimer = () => {
    timer = setInterval(() => {
        changeNumber.value++;
        if (changeNumber.value > 4) {
            changeNumber.value = 1
        }
    }, 5000);
};

// 点击按钮修改初始值
const changeIconNum01 = () => {
    clearInterval(timer); // 清除当前的定时器  
    changeNumber.value = 1; // 修改iconInfo的值  
    setTimer(); // 设置一个新的定时器  
};

// 初始设置定时器  
setTimer();