频繁操作中的防抖和节流

高频触发事件的防抖----属于前端性能优化部分

高频触发事件有窗口的resize事件，scroll事件  元素的mouseover事件

防止抖动（Debouncing）

// 简单示例
    
    window.addEventListener('resize',function(e){
        var t;
        return function(){
            if(t) clearTimeout(t);
            t = setTimeout(function(){
                // do something...
            },500);
        }
    }());
        

去抖动

 window.onscroll =  function(){
     //lazyload();
     debounce(lazyload,window);
 };
 function debounce(method,context){
    clearTimeout(method.timeout);
    method.timeout = setTimeout(function(){
          method.call(context);
    },500);
 } 
 function lazyload(){
 console.log("scroll执行了"+scrollnum);
  }

效果如下，可以看出只执行了一次lazyload函数

节流之后的滚动一次的执行效果

利用定时器，让函数执行延迟500毫秒，在500毫秒内如果有函数又被调用则删除上一次调用，这次调用500毫秒后执行，如此往复