debounce防抖函数减少函数调用的逻辑分析（包裹上时间的外衣，在时间还没来时，kill）

debounce防抖函数减少函数调用的逻辑分析

1，什么是debounce防抖函数：

• 当调用同一动作在n毫秒后，才会执行该动作，若在这n毫秒内又调用此动作则将重新计算执行时间。

2，debounce的代码：

      debounce(func, delay) {
        let timer = null
        return function (...args) {        //这一层函数的封装返回，是为了下一个原函数到来，可以拿到上一个原函数
          if (timer) clearTimeout(timer)
          timer = setTimeout(() => {
            func.apply(this, args)
          }, delay)
        }
      }

3，分析：（包裹上时间的外衣，在时间还没来时，kill）

从代码逻辑看，第一个原函数到来，在某个时间后才执行的原函数，先将原函数通过setTimeout封装起来保存到变量timer，

但是在下一个原函数的到来时，清除掉timer（即上一个通过时间的外衣包裹着的原生函数），然后又给它包裹上一层时间的外衣。

4，防抖函数使用场景：

（1）懒加载、滚动加载、加载更多或监听滚动条位置；

（2）搜索框输入，搜索联想功能；

（3）表单提交，防止表单重复提交；