一、闭包

闭包定义：

闭包是一种形式，即函数嵌套函数。其涉及两个原理，
一个是全局与局部作用域；
二是浏览器垃圾回收机制；在嵌套函数中，内部函数可以访问外部函数定义的变量，而被引用的变量不会被垃圾回收机制回收，可用于实现一个纯净的全局私有变量。

闭包的优点：

1. 可重复使用变量（全局变量的优点），不会造成变量污染（局部变量的优点）。闭包结合了全局变量合局部变量的优点。
2. 可以用于定义私有属性和私有方法。

闭包缺点：

比普通函数更占用内存，会导致网页性能下降，在IE下易造成内存泄露。

闭包应用场景：

防抖、节流等；防抖、节流属于性能优化方面的知识，可防止浏览器卡死，

二、防抖

问题:

有些事件的触发会导致函数的执行频率非常高，比例监听页面滚动，鼠标移动点击等。函数执行频率高会导致浏览器的性能下降。

解决思路：

1. 在第一次事件触发时，不立即执行函数，而是设定一个期限值；
2. 若在期限值内，事件没有再次被触发，则执行函数；若在期限值内，事件被再次触发，则清除当前计时器，重新开始记时。

具体实现代码：

 const debounce = (fn, wait)=> {
        let timeout = null ;
        return (res)=> {
            if(timeout){
                clearTimeout(timeout);
            }
            timeout = setTimeout(()=>{fn()}, wait||1000);
        }
    }
  //调用
    let fun1 = debounce(()=>{
        console.log(`防抖:${Math.random()}`);
    },2000);
     btn.onclick = ()=>{
        fun1(res)
    }

效果:

限制函数的执行频率，在期限时间内即使触发大量事件时，也只执行一次事件处理函数(最后一次)。
对于搜索框的input事件，如何实现输入时支持实时搜索，即每间隔一段时间就必须查询相关内容

三、节流

问题:

对于搜索框的input事件，如何实现输入时支持实时搜索，即每间隔一段时间就必须查询相关内容

解决思路：

1. 在第一次事件触发时，立即执行函数，并且设定一个期限值，在期限值内，该函数不再执行；
2. 过了期限后，该函数才能再次执行；

具体实现代码：

   // 节流
    const throttle = (fn, wait)=> {
        let timeout = null ;
        return (res)=> {
            if(timeout){
               return false
            }
            timeout = setTimeout(()=>{
                fn();
                timeout = null;
                // clearTimeout(timer);//函数执行完后清除定时器,表示冷却完成
                }, wait||1000);
        }
    }
  //调用
    let fun2 = throttle(()=>{
        console.log(`节流:${Math.random()}`);
    },2000)
     btn.onclick = ()=>{
        fun2(res)
    }

效果：

规定一定时间内执行一次函数，若事件一直在触发，事件函数在规定时间内必定会执行一次。

四、区别

防抖必须等最后一次触发事件后才能执行事件函数，而节流是规定时间内必定会执行一次且只执行一次事件函数。

首先知道闭包的有一个作用就是可以使父级函数的内部环境在变量中一直存在。参考这个
比如有个业务使用了debounce函数，用闭包后，对于该业务，timer将会一直存在，如果不用闭包，每次触发将会生成一个新的time，if (timeout)将永远不会被触发。
如果此时又有一个业务使用了debounce，用闭包的情况下，会为这个新的业务生成一个新的timeout