节流 & 防抖
函数节流 throttle
指定时间间隔内只会执行一次任务
常用于滚动条滚动监听等
function throttle(fn, timehold) {
let startTime = new Date().getTime();
const context = this;
return function() {
const currentTime = new Date().getTime();
if (currentTime - startTime >= timehold) {
fn.apply(context, [...arguments]);
startTime = currentTime;
}
};
}
函数防抖 debounce
任务频繁触发的情况下，只有任务触发的间隔超过指定间隔的时候，任务才会执行
即：用户在不触发事件时，才触发相应动作，以抑制本来在事件中要执行的动作。
常用于用户输入验证等
function debounce(fn, waitTime) {
let timeout;
return function() {
clearTimeout(timeout);
const args = arguments;
timeout = setTimeout(() => {
fn.apply(this, [...args]);
}, waitTime);
};
}