函數(shù)節(jié)流技術(shù)的主要思路是，通過一個(gè)定時(shí)器，阻斷連續(xù)重復(fù)的函數(shù)調(diào)用。對于我們自己內(nèi)部使用的函數(shù)，這通常意義不大，也不推薦使用這個(gè)技術(shù)，它可能會(huì)丟失對某些數(shù)據(jù)的處理。但是對于在用戶界面調(diào)用的函數(shù)，卻非常有意義。例如一個(gè) mousemove 或者 IE 中 resize 事件的監(jiān)聽函數(shù)。

這類事件監(jiān)聽函數(shù)往往伴隨著兩個(gè)主要特征：1. 短時(shí)間內(nèi)連續(xù)多次重復(fù)觸發(fā) ; 2. 大量的 DOM 操作。眾所周知，DOM 操作對內(nèi)存和 CPU 的開銷是比較大的，特別是當(dāng)同時(shí)滿足特征1時(shí)，往往給瀏覽器造成不小的壓力。函數(shù)節(jié)流技術(shù)的意義在于在用戶察覺范圍外，降低函數(shù)調(diào)用的頻率，從而提升性能。

這個(gè)技巧的大概模式如下面這樣：

 1 var processor = {
 2     timeoutId: null,
 3                    
 4     performProcessing: function(){
 5             // 要執(zhí)行的代碼
 6     },
 7 
 8     process: function(){
 9         clearTimeout(this.timeoutId);
10         this.timeoutId  = setTimeout(function(){
11             processor.performProcessing();
12         }, 100);
13     }
14 };
15                    
16 //調(diào)用
17 processor.process();

performProcessing 是真正要調(diào)用的函數(shù)，而程序的入口在 process，每次進(jìn)入 process，真正要調(diào)用的函數(shù) performProcessing 都會(huì)被延遲 100 毫秒執(zhí)行，如果在此期間，process 再次被調(diào)用，則會(huì)重置前一次的計(jì)時(shí)器，重新開始計(jì)時(shí)，這樣保證了 performProcessing 中的代碼至少要間隔 100 毫秒才會(huì)被執(zhí)行一次，原理非常的簡單，下面這個(gè)函數(shù)也是利用這個(gè)原理，通過閉包達(dá)到了同樣的目的，它接受兩個(gè)參數(shù)，第一個(gè)是要真正要執(zhí)行的函數(shù)，第二個(gè)是間隔的時(shí)間。

function throttle(fn, delay) {
    var timer = null;
    return function () {
        var context = this, args = arguments;
        clearTimeout(timer);
        timer = setTimeout(function () {
        fn.apply(context, args);
    }, delay);
  };
}

另外，有人為 jQuery 寫了相同功能的插件：點(diǎn)擊這里傳送到 jQuery plugins

Google Closure Library 也有類似的 API：點(diǎn)擊這里傳送到 Google Code