防抖函数需在闭包中声明 timerid 并每次触发前清除旧定时器，确保旧回调闭包被垃圾回收；应避免在闭包中长期持有大对象或 this，推荐解构必要参数。
防抖函数中，清除上一次的闭包引用，本质是清除上一次设置的定时器，并让该定时器回调里的闭包作用域不再被持有——关键在于把 timerId 存在闭包中，每次新调用时先清除旧的，再设新的。
用闭包保存 timerId 变量
闭包的作用是让内部函数能持续访问外部函数定义的变量。防抖函数返回的函数需要共享同一个 timerId，所以必须把 timerId 声明在闭包外部（即防抖工厂函数内部），而不是每次执行时重新声明。
- 错误做法：在返回的函数里用
let timerId—— 每次执行都是新变量，无法清除上次的定时器 - 正确做法：在防抖函数作用域内声明
let timerId = null，返回的函数通过闭包读写它
每次触发前先清除已有定时器
新事件触发时，要先调用 clearTimeout(timerId)（或 clearInterval），断开对上一个定时器的引用。JavaScript 的垃圾回收机制会自动回收已无引用的闭包，前提是：没有其他变量或闭包还持有对它的引用。
PigX UI 前端开发
下载
PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。
- 只要
timerId被重置为null或新值，旧定时器对象就失去外部引用 - 注意：如果定时器回调里有长生命周期的逻辑（比如发起未完成的 Promise、绑定未解绑的事件），需额外清理，仅清定时器不够
避免闭包中意外保留对外部大对象的引用
防抖函数内部若直接捕获了大型参数（如整个 DOM 元素、大数组），而这些参数又被定时器回调使用，就会导致内存无法释放。应只保留真正需要的数据。
- 推荐解构或提取必要字段，例如：
const { id, value } = args[0]，而非保存整个args - 不要在闭包中长期持有
this或组件实例，尤其在类方法中使用防抖时，建议用箭头函数或显式绑定
完整可运行示例
以下是一个兼顾清除引用和内存友好的基础实现：
function debounce(fn, delay) {
let timerId = null;
return function(...args) {
// 清除上一次定时器，断开对旧回调闭包的引用
if (timerId !== null) {
clearTimeout(timerId);
timerId = null;
}
timerId = setTimeout(() => {
fn.apply(this, args);
timerId = null; // 执行完主动清空，帮助 GC
}, delay);
};
}
这个实现中，timerId 是闭包变量，每次调用都复用它；清除动作发生在新定时器创建前，确保旧定时器回调不会执行，其闭包自然失去引用。
