自定义防抖函数（带取消功能）

在前端项目组经常会对搜索框使用防抖这个方法去减少API请求，如果用户关闭了搜索框，但是防抖方法还会继续运行，如何取消这个防抖呢？

```/**
 * 自定义防抖函数（带取消功能）
 * @param {Function} func 要防抖的函数
 * @param {number} delay 延迟时间（毫秒）
 * @returns {Function} 带取消方法的防抖函数
 */
function debounce(func, delay) {
  let timer = null;

  // 防抖处理函数
  const debounced = function(...args) {
    // 如果已有定时器，先清除
    if (timer) {
      clearTimeout(timer);
    }
    // 重新设置定时器
    timer = setTimeout(() => {
      func.apply(this, args);
      timer = null;
    }, delay);
  };

  // 取消防抖：清除当前等待的定时器
  debounced.cancel = function() {
    if (timer) {
      clearTimeout(timer);
      timer = null;
    }
  };

  // 立即执行：跳过延迟，立即执行并清除定时器
  debounced.flush = function() {
    // 先取消等待中的执行
    this.cancel();
    // 立即执行原函数
    func.apply(this, arguments);
  };

  return debounced;
}

// 使用示例
// 1. 定义需要防抖的函数
function search(keyword) {
  console.log('搜索内容:', keyword);
}

// 2. 创建防抖函数（延迟500ms）
const debouncedSearch = debounce(search, 500);

// 3. 模拟用户输入（快速连续触发）
debouncedSearch('java');
debouncedSearch('javascript');
debouncedSearch('js');

// 4. 场景示例：
// 取消防抖（比如用户突然关闭了搜索框）
// debouncedSearch.cancel();

// 立即执行（比如用户按下了回车，需要立即搜索）
// debouncedSearch.flush('typescript');