用戶在操作事件的時候可能會手抖多次觸發(fā)镀层,比如一個提交事件觸發(fā)多次向server端發(fā)送多次post或get請求丽声,就要用到防抖和節(jié)流來限制了。
防抖:
function debounce(func){
? ? let timer; //設置一個空計時器
? ? return ()=>{
? ? ? ? clearTimeout(timer); //每次觸發(fā)時都清掉上一個計時器
? ? ? ? //然后重新設置計時器
? ? ? ? timer = setTimeout(function(){
???????? ???? func.apply(this,arguments);
? ? ? ? }?,500);
? ? }
}
節(jié)流:
function debounce(func){
? ? let running =?false; //事件沒有點擊的時候為false。 防抖和節(jié)流的區(qū)別就在這里了
? ? return ()=>{
? ? ? ? if(running) return ; //running為true就直接返回
? ? ? ? running = true;
? ? ? ? setTimeout(function(){
? ? ? ? ? ?func.apply(this,arguments)
? ? ? ? ? ?running=false; //500ms執(zhí)行完了 running設置為false
? ? ? ? },500);
? ? }
}
道理咱都懂豆挽,就是名字起的真是一下子沒明白