JavaScript 从浅入深 100 题训练计划--（5）防抖函数（Debounce）

题目：手写防抖函数，支持立即执行模式和取消功能

理解防抖函数：

执行策略：触发后等待，最后一次操作后才执行

执行时机：停止操作后延迟执行

关键点：合并多次为一次

比喻：电梯关门（等人上完才关）

 

原理：

• 事件触发后等待一段延迟时间
• 等待期间再次触发则重新计时
• 最终只执行最后一次触发

function debounce(fn, delay = 300) {
  let timer = null;

  return function (...args) {
    const context = this;

    // 清除上一次的计时器
    if (timer) clearTimeout(timer);

    // 重新设置计时器
    timer = setTimeout(() => {
      fn.apply(context, args);
      timer = null;
    }, delay);
  };
}