节流是固定时间间隔内最多执行一次函数，如300ms内仅执行一次；实现有时间戳版（推荐，稳定无延迟）和定时器标记版（首次立即执行但后续可能卡顿）。
节流（throttle）是让函数在固定时间间隔内最多执行一次，不管事件触发多频繁。它不是“等停了再执行”，而是“定时发车”——比如设了 300ms，那无论你滚动 10 次还是 100 次，每 300ms 最多只调用一次回调。
节流函数怎么写？两种主流实现方式
最常用的是「时间戳」和「定时器标记」两种逻辑，它们行为一致但边界处理不同：
-
时间戳版：每次执行前比对
Date.now()和上次执行时间，差值 ≥ 间隔才执行并更新时间戳 -
定时器标记版：用布尔值
inThrottle锁住入口，执行后设为true，等setTimeout回来再解锁
推荐时间戳版——它不依赖异步队列状态，更稳定，且无“首次触发延迟”的问题（标记版第一次调用会立即执行，但第二次得等定时器结束才放行，中间可能卡住）。
function throttle(func, delay) {
let lastTime = 0;
return function(...args) {
const now = Date.now();
if (now - lastTime >= delay) {
func.apply(this, args);
lastTime = now;
}
};
}防抖（debounce）和节流到底差在哪？看触发节奏
关键不在“谁更快”，而在执行时机的语义完全不同：
立即学习“Java免费学习笔记（深入）”；
- 防抖：
debounce(fn, 500)→ 用户停止触发 500ms 后才执行一次，中间所有触发都被丢弃 - 节流：
throttle(fn, 500)→ 只要触发，就尝试执行；但每 500ms 内只允许成功一次，其余被跳过
举个真实例子：监听 scroll 事件做懒加载
- 用防抖？用户一滚到底，停住 → 等 500ms 后才检查是否到边，体验卡顿、加载滞后
- 用节流？滚动中每 500ms 检查一次位置，响应及时，又不爆炸式调用
别踩这些坑：参数、this、清除与实际场景错配
常见错误不是写错语法，而是没想清上下文：
- 漏传
...args或用arguments而没正确绑定this→ 回调里拿不到事件对象或 DOM 元素 - 把节流用在搜索框输入上 → 用户还在打字，函数已执行多次，发了冗余请求（该用防抖）
- 把防抖用在鼠标拖拽位置更新上 → 拖动结束才更新坐标，UI 完全跟不上手（该用节流）
- 没考虑
leading/trailing配置（如 Lodash 版）→ 默认只支持 trailing，但有些按钮点击需要“立刻执行+后续节流”，就得自己加逻辑
真正难的从来不是写出一个 throttle 函数，而是判断某个高频事件里，你到底要“抓过程”还是“等结果”。选错策略，性能优化反而变成体验降级。
