防抖和节流
// 防抖函数 :字面意思就是防止抖动,目的就是控制一下在短时间内多次触发同一事件的时候,减少执行的次数(理论上只执行最后一次)
// 一般用于页面滚动(懒加载),页面尺寸发生变化等
const fangDouFn = (fn, delay) =>{
let timer = null;
return () => {
if(timer){
clearTimeout(timer)
}
timer = setTimeout(fn, delay)
}
}
rootRef.onscroll = fangDouFn(()=>console.log('加载数据'),2000)
// 节流函数
// 节流函数一般用于防止按钮高频点击调用接口或者执行某种事件
const jieLiuFn = (Fn, delay) => {
let valid = false;
return () => {
if(valid ){
return false;
}
valid = true;
Fn();
setTimeout(()=>{ valid = false;}, delay)
}
}