安全清除 setInterval 的关键是统一管理 timer ID 生命周期：保存到可访问变量、清除前判空并置 null、避免闭包捕获旧 ID、组件销毁时在清理函数中幂等清除。
要安全地清除 setInterval 定时器，核心是：**确保清除时使用的是最初返回的同一 timer ID，并避免重复清除或清除已销毁的定时器**。关键不在“怎么调用 clearInterval”，而在于“怎么管理 timer ID 的生命周期”。
保存 timer ID 到可访问的变量或状态中
定时器 ID 是一个数字（在浏览器中），必须在启动后立即保存，且作用域要能被清除逻辑访问。
- 不要在函数内部临时声明（如
let timer = setInterval(...)且该函数执行完就丢失引用） - 推荐挂载到对象属性、模块级变量、React 的
useRef、Vue 的data或ref中 - 示例（普通 JS）：
let myTimer = null;<br>function start() { myTimer = setInterval(() => console.log('tick'), 1000); }<br>function stop() { if (myTimer != null) { clearInterval(myTimer); myTimer = null; } }
清除前判空 + 清除后置 null
多次调用 clearInterval 对同一个 ID 是安全的（无副作用），但重复启动未清除的定时器会导致多个并行任务。因此，清除前检查、清除后重置，是防御性编程的关键。
if (myTimer) { clearInterval(myTimer); myTimer = null; }- 置
null（或undefined）可防止下次误启或重复清除，也便于调试判断当前状态 - 不依赖
clearInterval(timer)的返回值做判断——它总是返回undefined，无法用于校验是否成功
避免闭包中持有过期 timer ID
在事件回调、异步操作或组件卸载逻辑中，容易因闭包捕获了旧的 timer 变量而导致清除失效。
立即学习“Java免费学习笔记（深入）”；
- 例如 React 中，若在
useEffect里启动定时器，却在另一个事件处理函数里用局部变量清除，可能读到初始值 - 正确做法：统一用
useRef存储 timer ID，所有读写都通过ref.current - Vue 3 Composition API 同理，用
ref(null)并始终操作其.value
组件/模块销毁时务必清除
定时器是常见内存泄漏源。只要宿主环境还在运行，定时器回调就会持续触发（即使 DOM 元素已移除、组件已卸载）。
- React：在
useEffect的清理函数中清除 - Vue：在
onBeforeUnmount或beforeDestroy钩子中清除 - 原生 JS 模块：导出一个
destroy()方法，由使用者负责调用 - 清除动作应幂等：即使组件意外重复卸载，也不应报错
