每日前端面试题-防抖和节流

防抖：事件被触发后，等待一段时间再执行函数，等待期间事件再次触发，需要重新计时。

适用场景

• 搜索框输入（等待用户输入完成后才进行搜索请求）

• 窗口大小调整（等待用户调整完成后才重新计算布局）

• 表单验证（输入完成后才验证，而非每输入一个字符就验证）

节流：在一段时间内，函数最多执行一次，即使事件被频繁触发，也会按照固定频率执行

适用场景

• 滚动事件（如滚动加载更多）

• 鼠标移动事件（如跟随鼠标位置的元素）

• 频繁点击按钮（如防止重复提交）

实际开发中常用 Lodash 的现成方法：

import { debounce, throttle } from 'lodash';

// 直接使用
window.addEventListener('resize', debounce(handleResize, 300));