Underscore.js 中 _.throttle 和 _.debounce 的差別

Underscore.js是一個很精幹的庫，壓縮後只有5.2KB。它提供了幾十種函數式編程的方法，彌補了標準庫的不足，大大方便了JavaScript的編程。

一般的函數（或方法）調用過程分爲三個部分：請求、執行和響應。（文中「請求」與「調用」同義，「響應」與「返回」同義，爲了更好的表述，刻意採用請求和響應的說法。）

某些場景下，好比響應鼠標移動或者窗口大小調整的事件，觸發頻率比較高。若稍處理函數微複雜，須要較多的運算執行時間，響應速度跟不上觸發頻率，每每會出現延遲，致使假死或者卡頓感。

在運算資源不夠的時候，最直觀的解決辦法就是升級硬件，誠然經過購買更好的硬件能夠解決部分問題，可是也須要爲此付出高額的成本。特別是客戶端和服務器模式，要求客戶端統一升級硬件基本不可能。

在資源有限的前提下，處理函數沒法即時響應高頻調用。退而求其次，只響應部分請求是否可行呢？某些場景下的密集性請求，具有很強的同質和連續性。好比說，鼠標移動的軌跡參數。響應越及時效果越平滑，可是若是響應速度跟不上時，反而會出現卡頓感，若是適當的丟棄一些請求效果更流暢。

throttle 和 debounce 是解決請求和響應速度不匹配問題的兩個方案。兩者的差別在於選擇不一樣的策略。

 

電梯超時

想象天天上班大廈底下的電梯。把電梯完成一次運送，類比爲一次函數的執行和響應。假設電梯有兩種運行策略throttle 和 debounce ，超時設定爲15秒，不考慮容量限制。

• throttle 策略的電梯。保證若是電梯第一我的進來後，15秒後準時運送一次，不等待。若是沒有人，則待機。
• debounce 策略的電梯。若是電梯裏有人進來，等待15秒。若是又人進來，15秒等待從新計時，直到15秒超時，開始運送。