/**
*
* @param fn {Function} 实际要执行的函数
* @param delay {Number} 延迟时间,也就是阈值,单位是毫秒(ms)
*
* @return {Function} 返回一个“去弹跳”了的函数
*/
function debounce(fn, delay = 500) {
// 定时器,用来 setTimeout
let timer = null;
// 返回一个函数,这个函数会在一个时间区间结束后的 delay 毫秒时执行 fn 函数
return function () {
// 保存函数调用时的上下文和参数,传递给 fn
const context = this;
const args = arguments;
// 每次这个返回的函数被调用,就清除定时器,以保证不执行 fn
clearTimeout(timer);
// 当返回的函数被最后一次调用后(也就是用户停止了某个连续的操作),
// 再过 delay 毫秒就执行 fn
timer = setTimeout(function () {
fn.apply(context, args);
}, delay);
};
}
export default debounce;
/**
* 节流函数
* @param method 事件触发的操作
* @param mustRunDelay 间隔多少毫秒需要触发一次事件
*/
function throttle(fn, mustRunDelay) {
let timer,
args = arguments,
start;
return function loop() {
let self = this;
let now = Date.now();//时间戳
if(!start){//若该函数是第一次调用,则直接设置start,即开始时间,为now,即此刻的时间
start = now;
}
if(timer){
clearTimeout(timer);
}
if(now - start >= mustRunDelay){
fn.apply(self, args);
start = now;
}else {
timer = setTimeout(function () { //
loop.apply(self, args);
}, 50);
}
}
}