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

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

這個技巧的大概模式如下面這樣：

var processor = {  
    timeoutId: null,  
 
    performProcessing: function(){  
            // 要執(zhí)行的代碼  
    },  
 
    process: function(){  
        clearTimeout(this.timeoutId);  
        this.timeoutId  = setTimeout(function(){  
            processor.performProcessing();  
        }, 100);  
    }  
};  
 
//調用  
processor.process();  
performProcessing 是真正要調用的函數(shù)，而程序的入口在 process，每次進入 process，真正要調用的函數(shù)
 performProcessing 都會被延遲 100 毫秒執(zhí)行，如果在此期間，process 再次被調用，則會重置前一次的計時器，
重新開始計時，這樣保證了 performProcessing 中的代碼至少要間隔 100 毫秒才會被執(zhí)行一次，原理非常的簡單，
下面這個函數(shù)也是利用這個原理，通過閉包達到了同樣的目的，它接受兩個參數(shù)，***個是要真正要執(zhí)行的函數(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);  
  };  
}  

【編輯推薦】

1. JavaScript大辯論：實施改進還是徹底放棄
2. Google強推Dart語言替代JavaScript 意欲何為？
3. 在.NET中使用Javascript作為腳本語言
4. JavaScript有關的10個秘密和怪癖
5. 10個***Web移動開發(fā)JavaScript框架推薦