防抖和节流

函数防抖(debounce)：触发高频事件后n秒内函数只会执行一次，如果n秒内高频事件再次被触发，则重新计算时间。

        btn.onclick = debounce(fn,500)
        //防抖代码
        function debounce(fn,delay) {
            console.log(this);
            var timer = null//存储定时器
            return function () {
                console.log('aaaa');
                clearTimeout(timer)
                timer = setTimeout(()=>{
                    fn()                
                }, delay)
            }
        }
        //处理函数
        function fn() {
            console.log("点击了没有超过500毫秒");
        }

函数节流：高频事件触发，但在n秒内只会执行一次，所以节流会稀释函数的执行频率。   
// 每次触发事件时，如果当前有等待执行的延时函数，则直接return 

var btn =document.getElementsByTagName('button')[0]
        btn.onclick=jieliu(fn,2000)

        function jieliu(fn,delay){
            var flag = true//表示当前没有触发
            return function(){
               //如果不为true 则默认是不能再次进行触发下面函数
               if(!flag) return;
               flag=false //点击了 就把flag 置为false 表示当前已经触发了点击事件

               setTimeout(function(){
                   console.log('固定2秒一次,在2秒内点击多次也只能执行一次');
                   //执行了就把flag = true
                   flag = true
               },2000)
            }
        }


       function fn(){
           console.log('这是事件处理函数');
       }