前言

對于提高 JavaScript 程序的性能這個問題，最簡單同時也是很容易被忽視的方法就是學習如何正確編寫高性能循環語句。本文將會幫你解決這個問題。

我們將看到 JavaScript 中主要的循環類型，以及如何針對它們進行高效編碼。

現在開始！

循環性能

談到循環性能，爭論的焦點始終會集中到關于應該使用哪種循環，哪個是速度最快、性能最好的？事實上，在 JavaScript 提供的四種循環類型中，只有一種比其他循環慢得多 ——  for-in 循環。 對循環類型的選擇應基于你的需求而不是性能問題。

有兩個主要因素有助于改善循環性能 —— 每次迭代完成的工作和迭代次數。

在下面的內容中，我們將會看到通過對這兩點的優化，可以對循環的整體性能產生積極的影響。

For 循環

在 ECMA-262（定義JavaScript的基本語法和行為的規范）第三版中，定義了四種循環類型。第一個是標準的 for 循環，它與其他類 C 語言的語法相同：

for (var i = 0; i < 10; i++){//循環體}

這可能是最常用的 JavaScript 循環結構。要了解應該怎樣對其進行優化，需要先進行一些分析。

解析

for 循環由四部分組成：初始化，預測試條件，循環體和后執行。它的工作方式如下：首先，執行初始化代碼（var i = 0;）。然后是預測試條件（i <10;）。如果預測試條件的計算結果為 true，則執行循環體。之后運行后執行代碼（i ++）。

優化

要優化循環中的工作量，第一步是最小化對象成員和數組項查找的數量。
還可以通過反轉順序來提高循環的性能。在 JavaScript 中，反轉循環對循環的性能提升不大，除非你消除了額外的操作。

// 原始循環for (var i = 0; i < items.length; i++){process(items[i]);}// 最小化屬性查找for (var i = 0, len = items.length; i < len; i++){process(items[i]);}// 最小化屬性查找并反序for (var i = items.length; i--; ){process(items[i]);}

While 循環

第二種是 while 循環。下面是一個簡單的預測試循環，由預測試條件和循環體組成。

var i = 0;while(i < 10){//循環體i++;}

解析

如果預測試條件的計算結果為 true，則執行循環體。如果不是 —— 它就會被跳過。每個 while 循環都可以用 for 替換，反之亦然。

優化

// 原始循環var j = 0;while (j < items.length){process(items[j++]);}// 最小化屬性查找var j = 0,count = items.length;while (j < count){process(items[j++]);}// 最小化屬性查找和反序var j = items.length;while (j--){process(items[j]);}