60 lines
1.3 KiB
JavaScript
60 lines
1.3 KiB
JavaScript
|
/**
|
|||
|
|
1. 函数节流（分页加载点击事件使用）
|
|||
|
|
2. @param fn
|
|||
|
|
3. @param interval
|
|||
|
|
4. @returns {Function}
|
|||
|
|
5. @constructor
|
|||
|
|
*/
|
|||
|
|
export const Throttle = (fn, t) => {
|
|||
|
|
let last;
|
|||
|
|
let timer;
|
|||
|
|
let interval = t || 500;
|
|||
|
|
return function() {
|
|||
|
|
let args = arguments;
|
|||
|
|
let now = +new Date();
|
|||
|
|
//等待执行
|
|||
|
|
if (last && now - last < interval) {
|
|||
|
|
clearTimeout(timer);
|
|||
|
|
timer = setTimeout(() => {
|
|||
|
|
// fn.apply(this, args); //非立即执行，则在wait毫秒内的结束处执行，快速点击N下的时候不需要触发函数
|
|||
|
|
last = now;
|
|||
|
|
}, interval);
|
|||
|
|
} else {
|
|||
|
|
fn.apply(this, args);//立即执行，则在wait毫秒内开始时执行
|
|||
|
|
last = now;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 函数防抖 （搜索框搜索使用）
|
|||
|
|
* @param fn
|
|||
|
|
* @param delay
|
|||
|
|
* @returns {Function}
|
|||
|
|
* @constructor
|
|||
|
|
*/
|
|||
|
|
export const Debounce = (fn, t) => {
|
|||
|
|
let delay = t || 500;
|
|||
|
|
let timer;
|
|||
|
|
return function() {
|
|||
|
|
let args = arguments;
|
|||
|
|
if (timer) {
|
|||
|
|
clearTimeout(timer);
|
|||
|
|
}
|
|||
|
|
timer = setTimeout(() => {
|
|||
|
|
timer = null;
|
|||
|
|
fn.apply(this, args);
|
|||
|
|
}, delay);
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
export const Debounce2 = (fn, t) => {
|
|||
|
|
let time = t || 500;
|
|||
|
|
let timeout = null;
|
|||
|
|
return function() {
|
|||
|
|
clearTimeout(timeout)
|
|||
|
|
timeout = setTimeout(() => {
|
|||
|
|
fn.apply(this, arguments);
|
|||
|
|
}, time);
|
|||
|
|
}
|
|||
|
|
};
|