函數(shù)防抖和函數(shù)節(jié)流
目標：降低事件的觸發(fā)頻率

頻繁觸發(fā)的事件：
onmousemmove onscroll onkeyup onkeydown window.onresize ...

函數(shù)防抖，在事件頻繁觸發(fā)時，只執(zhí)行最后一次
函數(shù)節(jié)流，在事件頻繁觸發(fā)時，每隔一段時間執(zhí)行一次

// 函數(shù)防抖
function debounce(delay,fnName){
    var timer;
    return function (){
        clearTimeout(timer);
        timer = setTimeout(function (){
            fnName();
        },delay);
    }
}

// 節(jié)流（定時器）：
     var throttle = function(func, delay) {
         var timer = null;
         return function() {
             var context = this;
             var args = arguments;
             // 每次觸發(fā)都判斷一次定時器是否為空
             // 只有執(zhí)行完才為空
             if (!timer) {
                 // 如果為空才會觸發(fā)，觸發(fā)完時間恢復空值
                 timer = setTimeout(function() {
                     func.apply(context, args);
                     timer = null;
                 }, delay);
             }
         }
     }
     //處理函數(shù)
     function handle() {
         console.log(Math.random());
     }
     //事件
     window.addEventListener('click', throttle(handle, 1000));

//節(jié)流throttle代碼（時間戳）
      var throttle = function(func, delay) {
        var prev = Date.now();
        return function() {
          var context = this;
          var args = arguments;
          // 取現(xiàn)在的時間和觸發(fā)時時間戳的差值
          // 差值達到了目標值才觸發(fā)
          var now = Date.now();
          if (now - prev >= delay) {
            func.apply(context, args);
            prev = Date.now();
          }
        }
      }
      //處理函數(shù)
      function handle() {
      　　console.log(Math.random());
      }
      //滾動事件
      window.addEventListener('scroll', throttle(handle, 1000));

使用場景（看需求）

防抖(debounce)
　　坐電梯，回城，只執(zhí)行最后一次
　　search搜索聯(lián)想，用戶在不斷輸入值時，用防抖來節(jié)約請求資源。
　　window觸發(fā)resize的時候，不斷的調整瀏覽器窗口大小會不斷的觸發(fā)這個事件，用防抖來讓其只觸發(fā)一次

節(jié)流(throttle)
　　使用技能，一段時間內執(zhí)行一次
　　鼠標不斷點擊觸發(fā)，mousedown(單位時間內只觸發(fā)一次)
　　監(jiān)聽滾動事件，比如是否滑到底部自動加載更多，用throttle來判斷

參考鏈接：https://www.cnblogs.com/ympjsc/p/11813691.html