在前端开发中，我们可能需要定时触发一些操作，比如每秒钟更新一个倒计时、每隔一段时间刷新页面等。对于这类需求，我们可以使用定时器 setTimeout 和 setInterval 进行实现。但是，这两个方法有一些问题，比如不精准、容易出错等。因此，我们需要一种更可靠、更精准的实现方式。在这里，我们推荐一个 npm 包：exact-ticker。
exact-ticker 简介
exact-ticker 是一个为浏览器提供高精度定时器功能的 npm 包。它的主要特点包括以下几个方面：
- 兼容性良好：支持主流浏览器和移动端浏览器；
- 精准度高：能够在毫秒级别上执行定时任务；
- API 简单：只需要调用一个方法即可创建定时器。
exact-ticker 安装
在使用 exact-ticker 之前，需要先安装它。在终端中执行以下命令：
npm install exact-ticker
exact-ticker 使用
创建定时器
使用 exact-ticker 创建定时器非常简单。只需要调用 ExactTicker 对象的 setInterval 方法即可，它的参数与 window.setInterval 方法类似。下面是一个示例：
import { ExactTicker } from 'exact-ticker';
const intervalId = ExactTicker.setInterval(() => {
console.log('tick');
}, 16.67);上面的代码中，我们创建了一个每秒钟执行 60 次的定时器，并输出了一个字符串。
需要注意的是，exact-ticker 的定时器与 window.setInterval 的定时器有所不同，它的精度是毫秒级别的。因此，我们需要调整定时器的执行间隔，使其达到预期的效果。
清除定时器
当我们不再需要一个定时器时，应该及时清除它。使用 exact-ticker 清除定时器也非常简单，只需要调用 ExactTicker 对象的 clearInterval 方法即可。下面是一个示例代码：
-- -------------------- ---- -------
------ - ----------- - ---- ---------------
----- ---------- - -------------------------- -- -
--------------------
-- -------
------------- -- -
--------------------------------------
-- -------上述代码创建了一个每秒执行 60 次的定时器，并在 10 秒后清除它。
总结
exact-ticker 是一个方便、高效、可靠的 npm 包，能够帮助我们创建高精度的定时器。它不但 API 简单易用，而且兼容性好，可以应用在大多数前端应用中。在使用 exact-ticker 时，需要注意定时器的执行间隔，避免精度误差导致的问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600562e281e8991b448e0667