防抖 debounce (一段時間不觸發事件才執行一次handle函式)
const input1 = document.getelementbyid('input1')
let timer = null
input1.addeventlistener('keyup',function ()
timer = settimeout(() =>,500)
})
情況一：
當輸入乙個數字時，keyup觸發，設定乙個定時器賦值給timer，500ms後列印input1.value的值
情況二：
當連續快速輸入幾個數字時，第乙個數字輸入後，keyup觸發，設定乙個定時器賦值給timer，還不到500ms時第二個數字又輸入了，此時timer有內容，清空前面的定時器，設定乙個新的定時器賦值給timer，直至最後乙個數字輸入完畢，500ms後列印input1.value的結果
封裝debounce防抖函式
function debounce(fn,delay = 500)
timer = settimeout(() => ,delay)
}}input1.addeventlistener('keyup',debounce(function () ,600))
debounce 防抖和 throttle 節流
視窗的resize scroll，輸入框內容校驗等操作時，如果這些操作處理函式較為複雜或頁面頻繁重渲染等操作時，如果事件觸發的頻率無限制，會加重瀏覽器的負擔，導致使用者體驗非常糟糕。此時我們可以採用debounce 防抖 和throttle 節流 的方式來減少觸發的頻率，同時又不影響實際效果。deb...
debounce防抖函式的使用
說明 1.首頁有30多張，每次載入完都要執行乙個refresh的函式，由於執行次數過多，對refresh函式進行防抖 2.位於元件goodsitem.vue中，需要傳送事件給home.vue 步驟 1.建立乙個utils.js檔案封裝debounce函式 func為要執行的函式 要防抖的 delay...
防抖 debounce 和節流 throttle
當呼叫動作觸發一段時間後，才會執行該動作，若在這段時間間隔內又呼叫此動作則將重新計算時間間隔。function debounce method,timeout,context timeout function handleresize window.onresize debounce handler...