怎样实现只在停止调用后执行的防抖函数?
参考答案
防抖将短时间内密集发生的调用合并。下面实现的是尾沿执行版本:距离最后一次调用经过 wait 后才执行,保留最后的参数与 this,并支持取消。它不包含首沿执行、最大等待时间或返回 Promise 等扩展语义。
JavaScript
function debounce(fn, wait) {
let timer;
function wrapped(...args) {
clearTimeout(timer);
timer = setTimeout(() => {
timer = undefined;
fn.apply(this, args);
}, wait);
}
wrapped.cancel = () => {
clearTimeout(timer);
timer = undefined;
};
return wrapped;
}
适合搜索建议等允许等待输入停顿的场景。持续输入可能一直不触发;组件卸载时应取消未执行任务。计时器延迟是调度条件,不是精确执行时刻。异步请求本身的取消和返回顺序还需要另外处理。