防抖是等用户停止操作后执行，节流是按固定间隔执行；防抖适用于搜索等需等待结束的场景，节流适用于滚动监听等需持续反馈的场景；二者实现原理、执行时机和适用条件均不同。
直接说清本质、区别和场景，比背代码更重要。面试官想听的是你是否真正理解“为什么需要它”，而不是能否默写函数。
一、用一句话讲清核心思想
防抖：等用户“停下来”再干活。比如输入框搜索，用户每敲一个字都触发，但只在最后停顿 500ms 后才发请求。
节流：按固定节奏干活。比如滚动监听，不管用户滚得多快，最多每 200ms 执行一次处理逻辑。
二、关键区别必须点明
• 防抖只响应最后一次（或第一次，取决于 immediate 参数），适合“等操作结束”类场景；
• 节流保证单位时间内至少执行一次，适合“持续反馈”类场景；
• 防抖靠 clearTimeout + setTimeout 实现；节流常用时间戳比较（now - lastTime >= interval）或定时器开关控制；
• 防抖可能永远不执行（用户一直动），节流只要触发就一定会按节奏执行（哪怕只触发一次）。
三、手写时优先写基础版，再提优化点
防抖基础版（带 immediate 支持）：
<script>
function debounce(fn, delay, immediate = false) {
let timer = null;
return function(...args) {
const callNow = immediate && !timer;
if (timer) clearTimeout(timer);
if (callNow) fn.apply(this, args);
timer = setTimeout(() => {
if (!immediate) fn.apply(this, args);
timer = null;
}, delay);
};
将一个或多个视频上传至YouTube。当用户想“上传到YouTube”“发YouTube”“批量上传”“upload to YouTube”“post videos to YouTube”或发布到YouTube时使用此技能。
}
</script>
节流基础版（时间戳法）：
<script>
function throttle(fn, interval) {
let lastTime = 0;
return function(...args) {
const now = Date.now();
if (now - lastTime >= interval) {
fn.apply(this, args);
lastTime = now;
}
};
}
</script>
补充说明：实际项目中会加 cancel 方法、返回 Promise 版本、支持 leading/trailing 等，但面试先保底写对基础逻辑。
四、举两个真实场景，带原因
• 输入搜索用防抖：避免用户还没输完就发起一堆无效请求，浪费带宽和后端资源；
• 滚动加载用节流：既要及时响应滚动位置判断是否靠近底部，又不能每像素都计算，否则卡顿明显。
如果被问“resize 用哪个”，可以说：一般用防抖（布局重算开销大，等用户调完再处理）；但如果是做实时视口适配动画，也可用节流控制更新频率。
