[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 ```