防抖:就是一定时间内,只会执行最后一次任务;
节流:就是一定时间内,只执行一次 ;
//函数节流
var r = function () {
console.log("薇恩开启大招 一秒隐身 进入夜行 收割时刻");
};
function lolHeroskill(fn, delay) {
let cd = true;
return function () {
if (cd) {
fn();
cd = false;
setTimeout(() => {
cd = true;
}, delay);
} else {
console.log('我进来else里面了')
}![在这里插入图片描述](https://img-blog.csdnimg.cn/20201201194051688.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0dhb3NoYW55eg==,size_16,color_FFFFFF,t_70#pic_center)
};
}
const use = lolHeroskill(r, 3000);
use();
use();
use();
use();
use();
use();
use();
use();
use();
use();
//可应用于防止用户连续事件 n秒内只执行一次
//防抖
function shuaka(fn, delay){
let timerId = null
return function(){
if(timerId){window.clearTimeout(timerId)}
timerId = setTimeout(()=>{
fn()
timerId = null
},delay)
}
}
const startshuaka = shuaka(()=>console.log('最后一个人上车了 公交可以开了'),5000);
startshuaka()
startshuaka()
startshuaka()
startshuaka()
startshuaka()
startshuaka()
startshuaka()
startshuaka()
startshuaka()
startshuaka()
//n秒内只执行最后一次
防抖:一定时间内,公交车司机等最后一个人上车后才关门
节流:薇恩开启大招后,cd期间再按R键是没反应的(n秒内只执行一次)