只执行一次用 setTimeout，重复执行用 setInterval；需及时清除定时器防内存泄漏，避免 setInterval 堆积调用，setTimeout 递归更可控，后台标签页会降低定时器精度。
setTimeout 和 setInterval 到底该选哪个
只执行一次的任务用 setTimeout，重复执行的用 setInterval。别反着来——有人用 setInterval 去发一次请求，结果接口被连刷十几遍才意识到问题。
常见错误现象：setInterval 启动后停不掉、内存泄漏、同一任务被多次注册；setTimeout 写成递归但忘了清除旧定时器，导致越跑越卡。
-
setTimeout返回一个数字 ID，必须用clearTimeout(id)清除 -
setInterval同样返回 ID，对应clearInterval(id)，不是clearTimeout - 如果任务逻辑可能耗时超过间隔时间（比如网络请求），
setInterval会堆积调用，建议改用setTimeout递归控制节奏
怎么安全地清除定时器防止内存泄漏
最常踩的坑：组件卸载了、页面跳转了，但定时器还在后台跑，还试图更新已销毁的 DOM 或 React state。
使用场景：React 组件里轮询数据、Vue 的 mounted/beforeUnmount 钩子、纯 JS 单页路由切换。
立即学习“前端免费学习笔记（深入）”；
- 把定时器 ID 存在变量里（比如
let timerId = null），不要直接写clearTimeout(setTimeout(...)) - 在退出逻辑前加判断：
if (timerId) { clearTimeout(timerId); timerId = null; } - React 函数组件推荐用
useEffect清理，但注意：清理函数里访问的变量要是闭包最新的值，必要时用useRef存 ID
为什么 setTimeout(fn, 0) 不是“立刻执行”
它只是把 fn 推进宏任务队列，等当前同步代码和所有微任务（如 Promise.then）跑完后才执行。所以实际延迟至少是几毫秒，且受浏览器节流影响（比如页面非激活状态时，setTimeout 最小间隔会被拉长到 1000ms）。
性能影响：滥用 setTimeout(fn, 0) 模拟异步，容易让事件循环变重；某些低功耗设备或后台标签页下，定时器会严重不准。
- 想真正“尽快”执行异步逻辑，优先用
Promise.resolve().then()（微任务） - 需要精确间隔（如动画），别用
setInterval，改用requestAnimationFrame+ 时间差校准 - Node.js 环境下，
setTimeout(fn, 0)实际最小延迟约 1ms，但 V8 仍可能合并多个 0ms 定时器
浏览器后台标签页对定时器的限制
Chrome、Firefox 等现代浏览器会主动限制非活跃标签页的定时器精度，setInterval 间隔被强制拉长到 1000ms 左右，setTimeout 同样受影响。这不是 bug，是省电策略。
使用场景：网页版监控面板、聊天消息轮询、倒计时显示——这些在用户切走后还强依赖定时器准确性的功能，大概率会出问题。
- 检测页面是否隐藏：监听
document.visibilityState === 'hidden'，此时暂停轮询，切回来再恢复 - 不要依赖连续的
setInterval做倒计时，改用服务器时间戳 + 客户端本地计算剩余时间 - Service Worker 中的定时任务不受此限制，但无法直接操作页面 DOM
定时器看着简单，但跨环境行为差异大，尤其是涉及页面生命周期、后台运行、精度要求时，光靠“设个时间就完事”很容易埋雷。最麻烦的往往不是怎么启动，而是什么时候、以什么方式停下来。
