防抖
一个
连续操作
中的处理,只触发一次,从而实现防抖动。
/**
* 思路:在事件被触发n秒后在执行回调,如果在这个n秒内又被触发,则重新计时
* @desc 函数防抖
* @param func 函数
* @param wait 延迟执行毫秒数
* @param immediate true 表立即执行,false 表非立即执行
*/
function debounce(func,wait,immediate) {
let timeout;
return function () {
let context = this;
let args = arguments;
if (timeout) clearTimeout(timeout);
if (immediate) {
var callNow = !timeout;
timeout = setTimeout(() => {
timeout = null;
}, wait)
if (callNow) func.apply(context, args)
}
else {
timeout = setTimeout(function(){
func.apply(context, args)
}, wait);
}
}
}
节流
一个
连续操作
中的处理,按照阀值时间间隔进行触发,从而实现节流
/**
* 思路:预定一个函数只有在大于等于执行周期时才执行,周期内调用不执行
* @desc 函数节流
* @param func 函数
* @param wait 执行周期毫秒数
*/
function throttle(fn, wait) {
let prev = new Date();
return function() {
const args = arguments;
const now = new Date();
if(now - prev > wait) {
fn.apply(this, args);
prev = new Date();
}
}
}
连续操作:两个操作之间的时间间隔小于设定的阀值,这样子的一连串操作视为连续操作。