JavaScript中for迴圈寫法對運作效率有什麼影響？

for迴圈寫法對效率的影響

總的來說對於for迴圈的寫法有這麼兩種：

1. 不寫宣告變數的寫法：for(var i = 0;i<arr.length;i++){}

2. 寫入宣告變數的寫法：for (var i = 0,len = arr.length;i < len;i++){}
   

除了for迴圈還有forEach() ，也有文章說forEach()效率最高，推薦用forEach()寫法，那麼到底哪個效率高呢？做個測試來看看吧。

測試方案

總的測試方案如下：

1. 做一個容納4千萬的測試陣列變數。

2. 分別用兩種寫法的for迴圈和foreach對這個測試變數進行遍歷。

3. 在同一台穩定機器上，進行10次測試，最後取平均值。

4. 測試環境：CPU:Inter(R) Core i5-3210M,RAM:12GM,system:win10(x64)
   

測試流程

製作測試變數

先用while迴圈做個測試變數出來，這個很簡單，如下：

var testArrs = [],
 i = 0;
while(i<40000000){
 testArrs.push(i);
 i++;
}

寫對應測試函數

測量和執行時間的程式碼，我用的是console.time()和console.timeEnd()來進行測試。

針對這個三個for迴圈，先做出三個函數出來，他們分別是

foreach迴圈測試:

function testForeach(testArrs){
 console.time('foreach');
 var newArrs = [];
 testArrs.forEach(function(i){
 newArrs.push(i);
 });
 console.timeEnd('foreach');
}

沒有宣告變數的for循環:

function testNoDeclare(testArrs){
 console.time('no declare');
 var newArrs = [];
 for(var i = 0;i<testArrs.length;i++){
 newArrs.push(i);
 }
 console.timeEnd(&#39;no declare&#39;);
}

有變數宣告的寫法

##

function testUseDeclare(testArrs){
 console.time('use declare');
 var newArrs = [];
 for(var i = 0,len = testArrs.length;i<len;i++){
 newArrs.push(i);
 }
 console.timeEnd(&#39;use declare&#39;);
}

執行測試函數

執行測試函數這裡很簡單啦，就是呼叫函數就可以了

testForeach(testArrs);
testNoDeclare(testArrs);
testUseDeclare(testArrs);

測試結果

經過10次測試，得到了以下結果

foreach不寫宣告寫宣告2372.891ms672.530ms743.974ms#2431.821ms2431.821ms #710.275ms805.676ms2422.448ms729.287ms741.014ms#2330.894ms730.200ms#755.390ms2423.186ms#703.255ms769.674 ms2379.167ms689.811ms741.040ms#2372.944ms710.524ms726.522ms#747.427ms817.098 ms平均值

	##2372.944ms	#712.103ms
	2316.005ms	726.518ms
	2535.289ms	733.826ms
	2560.925ms	#793.680ms
	平均值	平均值

2414.56ms720.15ms

755.83ms

#不知道結果有沒有讓你出乎意料呢？沒想到最平常的寫法效率最高，為什麼？我也沒想明白，誰知道就告訴我吧，但我估計寫聲明的寫法是沒有意義的。因為

len = arr.length

這個
arr.length

可能已經快取起來了，所以我們在宣告個len變數來儲存是沒有意義的。

1. for迴圈的特殊寫法

2. for迴圈的基本語法是:

##

for (语句 1; 语句 2; 语句 3)
{
被执行的代码块
}

3. 
   語句1：在迴圈（程式碼區塊）開始前執行

語句2：定義執行迴圈（程式碼區塊）的條件

語句3：在迴圈（程式碼區塊）已執行之後執行

如果我們用for迴圈要輸出1到10，我們可以這麼寫:

for(var i=0;i<10;i++){
console.log(i);
}

但是！根據上面的文法說明，我們也可以寫成這樣

for(var i=10;i--;){
console.log(i);
}

剛開始看的時候我也很疑惑，怎麼能這麼寫？語句2放的是循環條件，i–是什麼判斷條件。其實不然，在語句2中，如果回傳true迴圈會繼續執行。在js中0,null,undefined,false,'',”」作為條件判斷時，其結果為false，也就說當i–到0的時候就是false，循環就終止了。

再回到文章開頭的程式碼

######

for (var i = 0, rule; rule = rules[i++];) {
 //do something
}

###這個rule = rules[i++]就是判斷條件，當成為undefined時就會終止迴圈啦。所以這段程式碼換成普通寫法就是這樣的：############

for(var i = 0;i < rules.length;i++){
 var rule = rules[i]
}

###其實就是把判斷和賦值放到一起了，一邊循環一邊賦值。是不是挺簡單？ ###

以上是JavaScript中for迴圈寫法對運作效率有什麼影響？的詳細內容。更多資訊請關注PHP中文網其他相關文章！