js中的防抖函数

Posted 2021-02-19 世界之大

举个例子:   

  　　我们直接执行了一个 refresh(),这个refresh函数会被执行30次,

 　　 这样的话就太过于频繁了,我们就可以将refresh放入防抖函数中去,生成一个新的函数,之后,我们就使用新的函数

　　  这个新生成的函数,并不会非常频繁的调用,如果下一次执行来的非常快,那么会将上一次的取消掉;

 

 

　　  上面说的可能有些抽象了,看看下面的代码,估计会好理解一些

　　  

    /**

     * 封装一个防抖动方法

     * debounce: 防抖函数,  它的两个参数=>  func:函数(要进行防抖的函数)    delay: 毫秒(传入一个时间限制,毫秒)

     * let timer = null;  声明一个timer为null

     * if(timer) clearTimeout(timer) ===============> 如果timer不为空,那么清空它(干掉他)

     * 

     * delay :传入的毫秒,在这也就是延迟时间

     */

    debounce(func, delay) {
      let timer = null;
      return function(...args) {
        if (timer) clearTimeout(timer);
        timer = setTimeout(() => {
          func.apply(this, args);
        }, delay);
      };
    }