這篇文章給大家分享的是有關JavaScript中for循環(huán)怎么用的內(nèi)容。小編覺得挺實用的，因此分享給大家做個參考，一起跟隨小編過來看看吧。

專業(yè)從事成都網(wǎng)站設計、成都網(wǎng)站建設、外貿(mào)網(wǎng)站建設,高端網(wǎng)站制作設計,微信小程序開發(fā),網(wǎng)站推廣的成都做網(wǎng)站的公司。優(yōu)秀技術團隊竭力真誠服務，采用H5場景定制+CSS3前端渲染技術，成都響應式網(wǎng)站建設公司，讓網(wǎng)站在手機、平板、PC、微信下都能呈現(xiàn)。建站過程建立專項小組，與您實時在線互動，隨時提供解決方案，暢聊想法和感受。

前言

對于for循環(huán)，相信大家再常用不過了。但是這回說下for循環(huán)是因為看代碼時我居然沒有看明白一個for循環(huán)的意思，真是不應該啊。

這個for循環(huán)是這么寫的：

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

這個寫法是什么意思呢？后面再說，現(xiàn)賣個關子，這個寫法我感覺還是挺好的。

for循環(huán)寫法對效率的影響

說上面那段代碼之前，先說一下for循環(huán)的效率問題。在接觸js時關于for循環(huán)的寫法和對效率影響的文章挺不少的。但總的來說對于for循環(huán)的寫法有這么兩種：

1. 不寫聲明變量的寫法：for(var i = 0;i<arr.length;i++){}

2. 寫聲明變量的寫法：for(var i = 0,len = arr.length;i < len;i++){}

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

測試方案

總的測試方案如下：

1. 做一個容納4千萬的測試數(shù)組變量。

2. 分別用兩種寫法的for循環(huán)和foreach對這個測試變量進行遍歷。

3. 在同一臺穩(wěn)定機器上，進行10次測試，最后取平均值。

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

測試流程

制作測試變量

先用while循環(huán)做個測試變量出來，這個很簡單，具體如下：

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

編寫相應測試函數(shù)

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

針對這個三個for循環(huán)，先做出三個函數(shù)出來，他們分別是

foreach循環(huán)測試:

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

沒有聲明變量的for循環(huán):

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

有變量聲明的寫法

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

執(zhí)行測試函數(shù)

執(zhí)行測試函數(shù)這里很簡單啦，就是調(diào)用函數(shù)就可以了

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

測試結(jié)果

經(jīng)過10次測試，得到了以下結(jié)果

foreach	不寫聲明	寫聲明
2372.891ms	672.530ms	743.974ms
2431.821ms	710.275ms	805.676ms
2422.448ms	729.287ms	741.014ms
2330.894ms	730.200ms	755.390ms
2423.186ms	703.255ms	769.674ms
2379.167ms	689.811ms	741.040ms
2372.944ms	712.103ms	710.524ms
2316.005ms	726.518ms	726.522ms
2535.289ms	733.826ms	747.427ms
2560.925ms	793.680ms	817.098ms
平均值	平均值	平均值
2414.56ms	720.15ms	755.83ms

不知道結(jié)果有沒有讓你出乎意料呢？沒想到最平常的寫法效率最高，為什么？我也沒想明白，誰知道就告訴我吧，但我估計寫聲明的寫法是沒有意義的。因為len = arr.length這個arr.length可能已經(jīng)緩存起來了，所以我們在聲明個len變量來存儲是沒有意義的。

最后附上全部測試代碼，復制到自己的電腦上直接就可以測試了，要是有不合理的地方請告訴我吧

var testArrs = [],
 i = 0;
while(i<40000000){
 testArrs.push(i);
 i++;
}
function testForeach(testArrs){
 console.time('foreach');
 var newArrs = [];
 testArrs.forEach(function(i){
 newArrs.push(i);
 });
 console.timeEnd('foreach');
}
function testNoDeclare(testArrs){
 console.time('no declare');
 var newArrs = [];
 for(var i = 0;i<testArrs.length;i++){
 newArrs.push(i);
 }
 console.timeEnd('no declare');
}
function testUseDeclare(testArrs){
 console.time('use declare');
 var newArrs = [];
 for(var i = 0,len = testArrs.length;i<len;i++){
 newArrs.push(i);
 }
 console.timeEnd('use declare');
}
testForeach(testArrs);
testNoDeclare(testArrs);
testUseDeclare(testArrs);

for循環(huán)的特殊寫法

下面說下文章剛開始說的那個我沒看懂的代碼，說之前先溫習下再熟悉不過的for循環(huán)語法。for循環(huán)的基本語法是:

for (語句 1; 語句 2; 語句 3)
{
被執(zhí)行的代碼塊
}

1. 語句1：在循環(huán)（代碼塊）開始前執(zhí)行

2. 語句2：定義運行循環(huán)（代碼塊）的條件

3. 語句3：在循環(huán)（代碼塊）已被執(zhí)行之后執(zhí)行

如果我們用for循環(huán)要輸出1到10，我們可以這么寫:

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

但是！根據(jù)上面的語法說明，我們也可以寫成這樣

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

剛開始看的時候我也很疑惑，怎么能這么寫？語句2放的是循環(huán)條件，i–是什么判斷條件。其實不然，在語句2中，如果返回true循環(huán)會繼續(xù)執(zhí)行。在js中0,null,undefined,false,'',””作為條件判斷時，其結(jié)果為false，也就說當i–到0的時候就是false，循環(huán)就終止了。

再回到文章開頭的代碼

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

這個rule = rules[i++]就是判斷條件，當成為undefined時就會終止循環(huán)啦。所以這段代碼換成普通寫法就是這樣的：

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

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

感謝各位的閱讀！關于“JavaScript中for循環(huán)怎么用”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，讓大家可以學到更多知識，如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！

文章標題：JavaScript中for循環(huán)怎么用
地址分享：http://chinadenli.net/article36/ppissg.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供小程序開發(fā)、外貿(mào)網(wǎng)站建設、App開發(fā)、網(wǎng)站策劃、網(wǎng)站維護、虛擬主機

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)