如何最佳化JavaScript指令碼的效能

作者：ShiningRay @ Nirvana Studio

隨著網路的發展，網速和機器速度的提高，越來越多的網站用到了豐富用戶端技術。而現在Ajax則是最為流行的一種方式。JavaScript是一種解釋型語言，所以能無法達到和C/Java之類的水平，限制了它能在用戶端所做的事情，為了能改進他的效能，我想基於我以前給JavaScript做過的很多測試來談談自己的經驗，希望能協助大家改進自己的JavaScript指令碼效能。

語言層次方面迴圈

迴圈是很常用的一個控制結構，大部分東西要依靠它來完成，在JavaScript中，我們可以使用for(;;),while(),for(in)三種迴圈，事實上，這三種迴圈中for(in)的效率極差，因為他需要查詢散列鍵，只要可以就應該盡量少用。for(;;)和while迴圈的效能應該說基本（平時使用時）等價。

而事實上，如何使用這兩個迴圈，則有很大講究。我在測試中有些很有意思的情況，見附錄。最後得出的結論是：

如果是迴圈變數遞增或遞減，不要單獨對迴圈變數賦值，應該在它最後一次讀取的時候使用嵌套的++或--操作符。

如果要與數組的長度作比較，應該事先把數組的length屬性放入一個局部變數中，減少查詢次數。

舉例，假設arr是一個數組，最佳的遍曆元素方式為：

for(var i=0, len = arr.length;i<len;i++){...}

或者，如果無所謂順序的話：

for(var i=arr.length;i>0;i--){...}

局部變數和全域變數

局部變數的速度要比全域變數的訪問速度更快，因為全域變數其實是全域對象的成員，而局部變數是放在函數的棧當中的。

不使用Eval

使用eval相當於在運行時再次調用解釋引擎對內容進行運行，需要消耗大量時間。這時候使用JavaScript所支援的閉包可以實現函數模版（關於閉包的內容請參考函數式編程的有關內容）

減少對象尋找

因為JavaScript的解釋性，所以a.b.c.d.e，需要進行至少4次查詢操作，先檢查a再檢查a中的b，再檢查b中的c，如此往下。所以如果這樣的運算式重複出現，只要可能，應該盡量少出現這樣的運算式，可以利用局部變數，把它放入一個臨時的地方進行查詢。

這一點可以和迴圈結合起來，因為我們常常要根據字串、數組的長度進行迴圈，而通常這個長度是不變的，比如每次查詢a.length，就要額外進行一個操作，而預先把var

len=a.length，則就少了一次查詢。

字串串連

如果是追加字串，最好使用s+=anotherStr操作，而不是要使用s=s+anotherStr。

如果要串連多個字串，應該少使用+=，如

s+=a;
s+=b;
s+=c;

應該寫成

s+=a + b + c；