定时器函数不是精确时钟，需手动清理以防内存泄漏；应遵循“谁创建谁清理”原则，在组件卸载时清除；可选用 requestIdleCallback、可取消 Promise 或服务端推送等更可靠方案。
定时器函数（如 setTimeout 和 setInterval）是 JavaScript 中实现延迟执行和周期性执行的核心工具，但它们不是“准时钟”，用法不当容易引发内存泄漏、逻辑错乱或意外重复执行等问题。
定时器的基本用法与常见误区
setTimeout 用于延迟执行一次回调，setInterval 用于按固定间隔重复执行。关键点在于：它们的延迟时间是“最小延迟”，不是精确保证；实际执行时机取决于事件循环是否空闲。
- 未清除的
setInterval会持续运行，即使组件已卸载或对象已被销毁 - 在闭包中引用外部变量时，若变量被更新但定时器仍持有旧引用，可能造成状态不一致（例如 React 中的 stale closure 问题）
- 频繁调用
setTimeout（如递归式）但未清理前一个，可能导致多个定时器同时存在
如何安全地管理定时器生命周期
核心原则是“谁创建，谁清理”。尤其在组件化开发（如 React、Vue）中，必须在卸载/销毁阶段清除定时器。
- 用变量保存定时器 ID：
const timerId = setTimeout(...)，后续通过clearTimeout(timerId)或clearInterval(timerId)清除 - React 函数组件中，在
useEffect的清理函数里清除：return () => clearTimeout(timerId) - 避免在循环或条件分支中反复创建却只清除最后一个——应确保每次创建都对应一次明确的清除逻辑
替代方案与更可靠的模式
对精度、可取消性或上下文一致性要求高时，原生定时器不是最优解。
- 用
requestIdleCallback处理低优先级延迟任务（如日志上报），避免阻塞主线程 - 封装成可取消的 Promise 工具函数，例如：
const delay = (ms) => new Promise(r => setTimeout(r, ms))，配合AbortController实现中断 - 对轮询类需求，优先考虑服务端推送（WebSocket、SSE）而非前端
setInterval，减少无效请求和资源占用
调试与排查典型问题
定时器问题往往隐蔽，需结合行为表现和运行时状态判断。
- 浏览器开发者工具的 “Performance” 面板可录制并查看定时器触发时间线，识别是否堆积或延迟严重
- 在回调中打印
Date.now()与预期时间对比，确认是否因主线程阻塞导致大幅偏移 - 检查是否多次挂载组件却未清理定时器——可在设置定时器前先清除已有 ID，或使用唯一标识做防重
