闭包是实现防抖和节流的核心机制：它使内部函数能持续访问并修改外部函数作用域中的变量（如timer、lastTime），从而控制执行频率；若无闭包，状态将丢失，无法实现限频效果。
闭包是实现防抖和节流的核心机制：它让内部函数能持续访问并修改外部函数作用域中的变量（如定时器 ID、上一次执行时间等），从而控制函数的执行频率。
用闭包实现防抖（Debounce）
防抖的逻辑是：在指定延迟内，若函数被反复调用，就取消前一次的延时执行，只保留最后一次触发后的执行。
闭包保存了 timer 变量，确保每次调用都作用于同一个计时上下文：
function debounce(fn, delay) {
let timer = null;
return function (...args) {
clearTimeout(timer);
timer = setTimeout(() => {
fn.apply(this, args);
}, delay);
};
}
<p>// 使用示例
const handleResize = debounce(() => {
console.log('窗口尺寸已稳定');
}, 300);
window.addEventListener('resize', handleResize);
关键点：
立即学习“Java免费学习笔记（深入）”；
- timer 在闭包中维持状态，不会因多次调用而重置
- 每次新调用都会清除旧定时器，避免冗余执行
- 支持 this 和参数透传（用 ...args 和 apply）
用闭包实现节流（Throttle）
节流保证函数在单位时间内最多执行一次，常见策略是“定时器版”或“时间戳版”。闭包用于保存上次执行时间或定时器状态。
定时器版（推荐，更平滑）：
function throttle(fn, delay) {
let timer = null;
return function (...args) {
if (!timer) {
timer = setTimeout(() => {
fn.apply(this, args);
timer = null;
}, delay);
}
};
}
时间戳版（立即触发）：
function throttle(fn, delay) {
let lastTime = 0;
return function (...args) {
const now = Date.now();
if (now - lastTime >= delay) {
fn.apply(this, args);
lastTime = now;
}
};
}
关键点：
立即学习“Java免费学习笔记（深入）”；
- 定时器版用 timer 标记是否处于冷却期；时间戳版用 lastTime 记录上一次执行时刻
- 两种方式都依赖闭包持久化这些状态变量
- 注意：定时器版首次触发有延迟，时间戳版首次立即执行
增强实用性的小改进
实际项目中常需支持配置项，比如是否立即执行、是否在结束时再执行一次（类似 Lodash 的 leading/trailing）。闭包依然承担状态管理角色：
function throttle(fn, delay, options = {}) {
const { leading = true, trailing = false } = options;
let lastTime = 0;
let timer = null;
<p>const invokeFn = () => {
fn.apply(this, arguments);
};</p><p>return function (...args) {
const now = Date.now();
const elapsed = now - lastTime;</p><pre class="brush:php;toolbar:false;">if (!leading && !lastTime) {
lastTime = now;
return;
}
if (elapsed >= delay) {
invokeFn(...args);
lastTime = now;
if (timer) {
clearTimeout(timer);
timer = null;
}
} else if (trailing && !timer) {
timer = setTimeout(() => {
invokeFn(...args);
lastTime = Date.now();
timer = null;
}, delay - elapsed);
}}; }
这个版本仍靠闭包维护 lastTime 和 timer，同时支持灵活行为组合。
为什么必须用闭包？
如果不使用闭包，每次调用防抖/节流函数都会重新初始化 timer 或 lastTime，导致状态丢失，无法实现“抑制”或“限频”效果。只有闭包能让返回的函数持续持有并更新这些关键状态。
本质上，防抖和节流不是单纯的时间控制，而是对“调用历史”的记忆与决策——而闭包正是 JavaScript 中实现这种记忆能力的自然方式。
