防抖和節(jié)流：均是減少某一函數頻繁執(zhí)行消耗內存和資源的情況(減少執(zhí)行次數)。
防抖：規(guī)定在多久時間內沒有動作觸發(fā)函數才執(zhí)行該函數。
場景舉例：用戶滾輪滑動顯示距離頁頂的高度。
//顯示頁頂高度
function showTop(){
console.log(document.body.scrollTop||document.documentElement.scrollTop)
time = null;
}
//防抖函數
function rejectShook(){
var time = null;
return function(){
if(time==null){
//新建計時器，到時console
time = setTimeout(showTop,200)
}else{
//沒到時間刪除老計時器,新建另一計時器.
clearTimeout(timer);
time =setTimeout(showTop,200)
}
}
}
window.onscroll =rejectShook(showTop);
2.節(jié)流：類型于技能冷卻，觸發(fā)后一定時間不再觸發(fā)
function showTop(){
console.log(document.body.scrollTop||document.documentElement.scrollTop;);
}
window.onscroll =lessRender();
function lessRender(){
//定義一個冷卻,初始未冷卻：false
var lique =false;
return function(){
//查詢當前狀態(tài)
if(lique){
return;~~~~
}else{
show();
lique = true;
//重新進入冷卻,2s后可以再觸發(fā)
setTimeout(()=>{lique=false},2000)
}
}
}
|
QQ好友和群
QQ空間
騰訊微博
騰訊朋友
收藏
淘帖
頂
踩
