手写防抖和节流
记录手写防抖和节流
防抖(debounce)
当持续触发事件时,一定时间段内没有再触发事件,事件处理函数才会执行一次;
如果设定的时间到来之前,又一次触发了事件,就重新开始延时;
const debounce = (fn, t) => {
let time;
return function (...arg) {
clearTimeout(time);
let that = this;
time = setTimeout(function (...arg) {
fn.apply(that, arg);
}, t);
};
};节流(throttle)
当持续触发事件时,保证一定时间段内只调用一次事件处理函数;
const throttle = (fn, t) => {
let now = Date.now();
return function (...arg) {
if (Date.now() - now > t) {
fn.apply(this, arg);
now = Date.now();
}
};
};CC BY-NC-SA 4.0 2018–PRESENT © Wuxh