防抖節流

// fn 是須要節流處理的函數
// wait 是時間間隔
function throttle(fn, wait) {
  
  // previous 是上一次執行 fn 的時間
  // timer 是定時器
  let previous = 0, timer = null
  
  // 將 throttle 處理結果看成函數返回
  return function (...args) {
    
    // 獲取當前時間，轉換成時間戳，單位毫秒
    let now = +new Date()
    
    // ------ 新增部分 start ------ 
    // 判斷上次觸發的時間和本次觸發的時間差是否小於時間間隔
    if (now - previous < wait) {
         // 若是小於，則爲本次觸發操做設立一個新的定時器
       // 定時器時間結束後執行函數 fn 
       if (timer) clearTimeout(timer)
       timer = setTimeout(() => {
          previous = now
            fn.apply(this, args)
        }, wait)
    // ------ 新增部分 end ------ 
      
    } else {
       // 第一次執行
       // 或者時間間隔超出了設定的時間間隔，執行函數 fn
       previous = now
       fn.apply(this, args)
    }
  }
}

// DEMO
// 執行 throttle 函數返回新函數
const betterFn = throttle(() => console.log('fn 節流執行了'), 1000)
// 第一次觸發 scroll 執行一次 fn，每隔 1 秒後執行一次函數 fn，中止滑動 1 秒後再執行函數 fn
document.addEventListener('scroll', betterFn)