节流函数中定时器残留的本质是多次调用未清理前序定时器，导致回调堆积或延迟失控；应通过单一timer引用+每次clearTimeout确保仅存一个有效定时器，并在回调中置空timer以杜绝残留。
节流函数中定时器残留，本质是多次调用未清理前序定时器，导致回调堆积或延迟执行失控。关键不是“避免使用定时器”，而是让定时器的生命周期与节流逻辑严格对齐——每次只允许一个有效定时器存在，且必须在恰当时机清除或复用。
用单一 timer 引用 + clearTimeout 确保唯一性
每次调用节流函数时，先检查是否存在活跃定时器。如果有，立即清除；再设置新定时器。这能杜绝多个定时器并行：
- 声明一个闭包变量 timer = null，用于保存当前定时器 ID
- 每次进入节流函数，先执行 clearTimeout(timer)
- 再调用 setTimeout 并把新 ID 赋给 timer
- 不依赖状态位（如
valid）或时间戳比对，逻辑更直观、不易出错
区分「执行时机」：立即执行版 vs 延迟执行版
定时器残留问题常出现在混淆了两种节流语义：
- 延迟执行版（推荐用于按钮点击）：首次触发不立即执行，等 delay 后再运行；期间重复触发只刷新定时器。适合防重复提交
- 立即执行版（带后续冷却）：首次触发立刻执行，然后进入 delay 冷却期；冷却期内触发不执行也不设新定时器。适合 scroll/resize
- 若混用逻辑（比如该立即执行却用了 setTimeout 延迟，又没清 timer），就容易出现“看似节流、实则漏执行或叠加执行”
避免在异步回调中隐式保留 timer 引用
常见陷阱：节流函数返回的闭包里，setTimeout 回调中仍访问外部 timer，但该变量可能已被后续调用覆盖。解决方式：
立即学习“Java免费学习笔记（深入）”；
- 在 setTimeout 回调内部再次置空 timer，例如：
timer = null - 不要在回调里做二次判断或重设 timer，否则形成嵌套定时器链
- 若需支持取消节流（如组件卸载），额外暴露一个 cancel() 方法，统一清理 timer
实际写法示例（延迟执行型，防按钮连点）
这段代码确保无论用户点多少次，每 500ms 最多只执行一次回调，且无定时器残留：
function throttle(fn, delay) {
let timer = null;
return function(...args) {
if (timer) clearTimeout(timer);
timer = setTimeout(() => {
fn.apply(this, args);
timer = null; // 执行完立刻释放引用
}, delay);
};
}
