防抖和节流

  防抖：针对于高频触发事件如鼠标移动事件mousemove所做出的处理。

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

 let box = document.querySelector('.box')

        let timout1 = 0;

        box.onmousemove = function(){

            if(timout1) clearTimeout(timout1)

               

           

          timout1 = setTimeout(()=>{

                console.log(11);

                timout1=0;

            },1000)

        }

        box.onmousemove=debounce(f)

        function movefn (f){

            console.log(111);

        }

节流：也是针对于高频触发事件

高频事件触发，但在n秒内只执行一次，所以节流会稀释函数的执行频率。

 let box = document.querySelector('.box');

        let timout = 0;

        box.onmousemove= function(){

            if(timout){

              return ;

            }

      setTimeout (()=>{

       console.log(1);

       timout = 0;

      },1000);

        }