防抖是等“静止”后执行最后一次，节流是固定周期最多执行一次；防抖适用于搜索输入、表单校验、按钮防重，节流适用于滚动加载、resize响应、鼠标移动采样。
防抖与节流的思维导图不需要堆砌所有实现细节，重点是理清逻辑脉络、区分适用场景、抓住本质差异。下面按核心维度分块说明，可直接作为你画图的骨架。
一、本质一句话定位
防抖：等“静止”——连续触发时不断重置倒计时，只执行最后一次停顿后的操作。
节流：控“节奏”——固定时间窗口内最多执行一次，不管中间触发多少次。
二、触发行为对比（关键区分点）
用时间轴理解更直观：
- 假设事件在 0ms、200ms、400ms、900ms 触发，防抖设为 500ms → 只有 900ms 后再等满 500ms（即 1400ms 时刻）才执行一次
- 同样事件流，节流设为 500ms → 大概在 0ms 和 900ms 各执行一次（首次立即/延后 + 后续每 500ms 一周期）
三、典型使用场景归类
优先选防抖的场景：
- 搜索框输入联想（等用户打完再查）
- 表单输入校验（如邮箱格式，输完再提示）
- 按钮防重复提交（点击后延迟执行，中途再点就重置）
优先选节流的场景：
- 滚动加载更多（每滚一段就检查是否触底，不能等停）
- resize 布局重算（窗口拖拽中需定期响应，不能等到最后）
- 鼠标移动轨迹采样（如绘图、拖拽反馈）
四、简易实现结构（导图右侧可写伪代码）
防抖基础版：
– 用一个 timer 变量存定时器 ID
– 每次触发先 clear，再 set 新 setTimeout
– 回调执行时注意 this 和参数传递（用 apply 或箭头函数包裹）
节流两种常用思路：
- 时间戳法：记录上次执行时间，当前时间减去它 ≥ wait 才执行并更新时间
- 定时器法：用 flag 控制状态，触发时若无定时器则启动，执行后清除
不复杂但容易忽略
