防抖的核心是用闭包保存定时器引用,每次触发先清旧定时器再设新定时器,确保只执行最后一次;闭包使内部函数持续访问外部timer变量,实现状态私有化与多实例隔离;标准结构含参数接收、cleartimeout清理、settimeout设定;需注意this指向、参数传递及卸载时清除定时器。

防抖的核心是用闭包保存定时器引用,每次触发时先清除旧定时器再设新定时器,确保只执行最后一次调用。
闭包如何保存定时器状态
闭包让内部函数能持续访问外部函数的变量。在防抖中,timer 变量定义在防抖函数外部作用域,返回的事件处理函数每次都能读写它,从而实现对上一次定时器的控制。
- 不使用闭包的话,每次调用都会新建 timer,无法清除前一次任务
- 闭包让 timer 成为“私有状态”,仅该防抖函数实例可访问
- 多个防抖函数独立运行,各自维护自己的 timer,互不影响
典型防抖逻辑结构
标准实现包含三个关键部分:参数接收、定时器清理、新定时器设定。
- 接收目标函数 fn、延迟时间 delay(可选立即执行标志)
- 返回的函数每次执行时,先 clearTimeout(timer)
- 再用 setTimeout 设置新定时器,到时才真正执行 fn
- 若启用立即执行(leading),首次触发立刻运行,后续仍按延迟重置
常见误区与注意事项
实际使用中容易忽略上下文和参数传递问题。
- 直接 fn() 调用会丢失 this 指向,应改用 fn.apply(this, arguments) 或箭头函数+bind
- 需支持传参时,不能写死参数,要保留原调用的全部参数
- 组件卸载或事件解绑前,应手动清除残留定时器,避免内存泄漏
- 延迟时间不宜过短(如
不复杂但容易忽略细节。关键是闭包提供状态容器,定时器控制执行节奏,两者配合才能稳定限频。











