前言:防抖和节流都是为了阻止操作高频触发,从而浪费性能。
// 防抖 实例:搜索框、resize 浏览器窗口
// 高频触发只执行一次
function debounce(fn, wait) {
let timer = null;
return function () {
timer && clearTimeout(timer);
timer = setTimeout(() => {
fn.apply(this, arguments);
}, wait);
};
}
// 节流 实例:按钮事件、滚动加载事件
// 高频触发每隔wait秒执行一次
function throttle(fn, wait) {
let timer = null;
return function () {
if (!timer) {
timer = setTimeout(() => {
fn.apply(this, arguments);
timer = null;
}, wait);
}
};
}