在触发一段时间后执行事件，如果这段时间内又触发了，则持续期待同样的工夫。
防抖在理论开发中应用场景还是蛮多，比方列表的实时搜寻等。延时执行，这很容易想到应用setTimeout来实现。
根底版
function debounce(func, wait) { let timer; return function () { timer && clearTimeout(timer); timer = setTimeout(func, wait); };}测试一下
// 应用input输入框做一个测试// html<input id="input" /><div id="text"></div>// jsinput.oninput = debounce(() => { text.innerHTML = input.value;}, 1000);
嗯。如同没什么问题。不过咱们发现下面在获取input的值的时候应用的是input.value，那其实oninput事件应该是存在一个参数是event，能够间接应用event.target.value获取。
// 应用input输入框做一个测试// html<input id="input" /><div id="text"></div>// jsinput.oninput = debounce((e) => { text.innerHTML = e.target.value; // Uncaught TypeError: Cannot read property 'target' of undefined}, 1000);不出预料的报错了，这是因为debounce函数返回的是一个新的函数，并没有将原有函数的this值绑定到新的函数上，也没有将参数传递给新的函数。咱们来改一改。
解决了this和参数的版本
function debounce(func, wait) { let timer; return function (...args) { timer && clearTimeout(timer); timer = setTimeout(() => { func.apply(this, args); }, wait); };}这时候又来了个新需要，须要在计时开始时执行，而不是在结尾执行。同样的，原来的逻辑不变，只是须要新增一个立刻执行的逻辑。想一想咱们的需要：立刻执行，而后在固定的一段时间内不再触发第二次 。在立刻执行代码之后，能够设置一个变量flag（初始值为true）用来记录上一次执行的工夫到当初是否超过wait，如果超过则将flag设置为true，意味着能够再次执行。
function debounce(func, wait, immediate) { let timer; return function (...args) { timer && clearTimeout(timer); if (immediate) { // timer就是咱们应用的flag if (!timer) { func.apply(this, args); } // 在代码执行的wait s之后将timer设置为null // 当下一次执行以后函数则能够触发判断 !timer === true timer = setTimeout(() => { timer = null; }, wait); } else { timer = setTimeout(() => { func.apply(this, args); }, wait); } };}当然，咱们还能够像lodash一样，增加cancel、pending等办法。
function debounce(func, wait, immediate) { let timer; const debounced = function (...args) { timer && clearTimeout(timer); if (immediate) { if (!timer) { func.apply(this, args); } timer = setTimeout(() => { timer = null; }, wait); } else { timer = setTimeout(() => { func.apply(this, args); timer = null; }, wait); } }; debounced.cancel = function() { timer && clearTimeout(timer); } debounced.pending = function() { return !!timer; } return debounced;}相干：
JavaScript日常学习之防抖
JavaScript日常学习之节流
上述代码的残缺代码