[TOC] #### 1. 防抖是什么 ---- 防抖: 在事件被觸發 n 秒后執行回調，如果在這 n 秒內又被觸發，則重新計時 防抖的應用場景: 輸入框連續輸入值后，等到最后一次輸入完成才觸發查詢的動作 #### 2. 輸入框的防抖處理 ---- ```html <input type="text" id="ipt"> ``` ```javascript function input(e) { request(e.target.value) } function request(data) { console.log('請求參數: ', data); } // 防抖函數 function debounce(fun, delay = 200) { let timeout = null return function (...args) { if (timeout) { clearTimeout(timeout) timeout = null } timeout = setTimeout(() => { fun.apply(this, args) }, delay) } } input = debounce(input, 300) document.getElementById('ipt').oninput = input ```