//在連續觸發某個函式時,只在最後一次讓對應的函式執行
function debounce(fn,wait){//debounce處理過的函式都是防抖函式
wait = wait || 1000;
var timer = null;//建立一個標記 用來存放定時器的返回值
return function (){
clearInterval(timer);//每當使用者輸入的時候把前一個setTimeout清除掉
timer = setInterval(()=>{//然後又建立一個新的setTimeout,這樣就能保證輸入的字元後的interval 間隔內如果還有字元輸入的話,就不會執行fn 函式
fn.apply(this,arguments);
},wait)
}
}
let fn = function(){console.log(this)}
let f = debounce(fn,1000)
window.onscroll = f;
複製程式碼
防抖原理以及簡單實現
相關文章
- JS簡單實現防抖和節流JS
- JavaScript防抖實現JavaScript
- Vue響應式原理以及簡單實現Vue
- 函式節流、函式防抖實現原理分析函式
- 聊天室原始碼開發中防抖節流的簡單實現原始碼
- React如何原生實現防抖?React
- JavaFx 實現按鈕防抖Java
- Vue元件實現函式防抖Vue元件函式
- Vue實現函式防抖元件Vue函式元件
- 簡單實現vuex原理Vue
- 一款簡單的訊息防抖框架框架
- 防抖和節流原理分析
- Redux 原理和簡單實現Redux
- MapReduce原理及簡單實現
- 簡單的實現vue原理Vue
- 簡單的實現React原理React
- vue 實現原理及簡單示例實現Vue
- 簡單、好懂的Svelte實現原理
- 簡單介紹numpy實現RNN原理實現RNN
- jQuery.noConflict()實現防衝突原理機制簡單介紹jQuery
- 單點登入原理與簡單實現
- 防抖
- 防抖與節流的區別與實現
- 簡單介紹JS函式防抖和函式節流JS函式
- 前端路由簡介以及vue-router實現原理前端路由Vue
- virtual-dom原理與簡單實現
- async/await 原理及簡單實現AI
- vitual-dom原理與簡單實現
- js 防抖實戰講解JS
- 影片直播原始碼,js實現節流和防抖原始碼JS
- PHP 防抖(防重複提交)有哪些實現方法,具體程式碼PHP
- JS防抖JS
- 簡單實現類似Spring的Aop原理實現Spring
- Xposed簡介以及小米去桌面廣告的簡單實現
- React-redux的原理以及簡單使用ReactRedux
- 節流原理以及實現
- 自己簡單實現Spring的IOC原理Spring
- 什麼是節流函式以及防抖函式?函式