函数 - 防抖（debounce）

1、多种不同的解释（定义）

1、短时间内多次触发，最终在停止触发后的某个指定时间执行一次函数，只执行一次。 2、防抖: 指触发事件n秒后才执行函数，如果在n秒内又触发事件，则会重新计算函数执行时间。 3、防抖是n秒内重复的触发会导致重新计时，直到n秒内没有重复触发函数才会执行。

2、示例1 - 监听滚动条

let timer; window.onscroll = function() { // 如果当前 timer 不是 undefined ， // 说明前面有一个等待的请求还未发送， // 就停止前面的等待 if (timer !== undefined) { clearTimeout(timer); } // 再重现下一轮等待 timer = setTimeout(function() { // 当 500ms 内，未发生滚动时， // 才发送正式的 ajax 请求 console.log('发送 ajax 请求'); }, 500); }; 

3、示例2 - 按钮点击

<button id="btn">防抖 let timer; return function() { // 如果 500 毫秒内又一次触发， // 则会重新计算时间 // if (timer) clearTimeout(timer):  // 相当于清除定时器并且 return if (timer) clearTimeout(timer); timer = setTimeout(() => { console.log('发送请求') }, 500); }; }; // document.querySelector('#btn'): 通过 id 获取元素 // addEventListener('click', clearT()): 给元素添加监听事件 clearT() document.querySelector('#btn').addEventListener('click', clearT());