前端写JS经常用到的事件函数，持续更新中

前端写JS经常用到的事件函数，以下是博主经常用到事件函数：

1. 防抖 (Debounce)

场景：防止函数在短时间内被高频触发，常用于输入框搜索、窗口大小调整等。

代码：

function debounce(fn, delay) {
  let timer = null;
  return function(...args) {
    if (timer) clearTimeout(timer);
    timer = setTimeout(() => {
      fn.apply(this, args);
    }, delay);
  };
}

// 使用示例
const debouncedSearch = debounce(() => console.log('Searching...'), 500);
window.addEventListener('input', debouncedSearch);

2. 节流 (Throttle)

场景：保证函数在一定时间间隔内只执行一次，常用于监听滚动事件、拖拽事件。

代码：

function throttle(fn, delay) {
  let lastTime = 0;
  return function(...args) {
    const now = Date.now();
    if (now - lastTime > delay) {
      lastTime = now;
      fn.apply(this, args);
    }
  };
}

// 使用示例
const throttledScroll = throttle(() => console.log('Scrolling...'), 1000);
window.addEventListener('scroll', throttledScroll);

3. 数组去重 (Unique Array)

场景：移除数组中的重复元素。

代码：

function setArray(arr) {
  return [...new Set(arr)];
}

// 使用示例
console.log(setArray([1, 1, 'b', 'b', 3, 3])); // 输出 [1, "a", 3]

4. 生成随机字符串 (Generate Random String)

场景：生成一个指定长度的随机字符串，常用作唯一ID。

代码：

function randomString(length = 8) {
  return Math.random().toString(36).substring(2, 2 + length);
}
// 使用示例
console.log(randomString(10)); // 输出类似 "7j2k9n4p1q"

5. 首字母大写 (Capitalize)

场景：将字符串的第一个字母转换为大写。

代码：

function capitalize([first, ...rest]) {
  return first.toUpperCase() + rest.join('');
}

// 使用示例
console.log(capitalize('helloWorld')); // 输出 "HelloWorld"

6. 复制到剪贴板 (Copy to Clipboard)

场景：将文本内容异步复制到用户剪贴板。

代码：

async function copyToClipboard(text) {
  if (!navigator.clipboard) {
    console.error('Clipboard API not available');
    return Promise.reject('Clipboard API not available');
  }
  try {
    await navigator.clipboard.writeText(text);
    console.log('Copied to clipboard');
    return Promise.resolve();
  } catch (err) {
    console.error('Failed to copy: ', err);
    return Promise.reject(err);
  }
}

// 使用示例
// copyToClipboard('Hello, Gemini!');

以上就是我为你精选的6个事件函数，你可以将它们收藏起来，根据自己的项目需求进行修改和扩展，小编还会持续更新文档