JavaScript での for ループの記述は実行効率にどのような影響を与えますか?

for ループの記述が効率に及ぼす影響

一般に、for ループを記述するには 2 つの方法があります:

1. 変数を宣言せずに記述する: for(var i = 0;i<arr .length; i++){}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.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

不知道结果有没有让你出乎意料呢？没想到最平常的写法效率最高，为什么？我也没想明白，谁知道就告诉我吧，但我估计写声明的写法是没有意义的。因为len = arr.length这个arr.length

変数の宣言方法を記述します: for(var i = 0,len = arr.length;i < len;i++){}

forループの他にforEach()もあり、forEach()を使うのが最も効率的だという記事もあります。 forEach() の記述メソッドですが、どちらがより効率的でしょうか?テストを行って見てみましょう。

テスト計画

1. 全体的なテスト計画は次のとおりです:

2. 4,000 万を保持するテスト配列変数を作成します。

3. 
   このテスト変数を走査するには、for ループと foreach の 2 つの記述方法を使用します。

同じ安定したマシンで 10 回のテストを実行し、最後に平均値を取得します。

テスト環境: CPU: Inter(R) Core i5-3210M、RAM: 12GM、システム: win10 (x64)

テストプロセス

テスト変数を作成

まずはしばらく使ってみるループ テスト変数を作成します。詳細は次のとおりです。

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

時間を測定して実行するコードを作成します。console.time()< /code> と <code>console.timeEnd() はテスト用です。 🎜🎜これら 3 つの for ループでは、まず 3 つの関数を作成します。それらは 🎜🎜foreach ループのテスト:🎜🎜🎜🎜

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

🎜変数宣言のない for ループ:🎜🎜🎜🎜

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

🎜 変数宣言の書き方 🎜🎜🎜🎜

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

🎜 🎜テスト関数を実行する🎜🎜🎜テスト関数の実行は非常に簡単で、関数を呼び出すだけです🎜🎜🎜🎜

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

🎜🎜テスト結果🎜🎜🎜10回のテストの後、次の結果が得られました🎜 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.186ms703.255ミリ秒769.674ミリ秒 2379.167ミリ秒 689.811ミリ秒 741.040ミリ秒 tr> 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 🎜この結果には驚かれたでしょうか?最も一般的な書き方が最も効率的だとは思いませんでした。なぜでしょうか。よく分からないので知っている人がいたら教えて欲しいのですが、この書き方では意味が無いと思います。 len = arr.length であるため、この arr.length はキャッシュされている可能性があるため、ストレージ用に len 変数を宣言することは意味がありません。 🎜🎜🎜for ループを記述する特別な方法🎜🎜🎜 for ループの基本構文は次のとおりです:🎜🎜🎜🎜rrreee🎜🎜🎜ステートメント 1: ループ (コード ブロック) が開始する前に実行します🎜🎜🎜🎜ステートメント 2:実行ループ (コード ブロック) 条件を定義します 🎜🎜🎜🎜 ステートメント 3: ループ (コード ブロック) が実行された後に実行されます 🎜🎜🎜🎜🎜 for ループを使用して 1 ～ 10 を出力すると、次のように書くことができます: 🎜🎜 🎜🎜えー🎜 でも！上記の文法に従って、このように書くこともできます🎜🎜🎜🎜rrreee🎜最初に読んだときは混乱しました、どうやってこのように書くことができるのですか？ステートメント 2 にはループ条件が含まれており、i- は判定条件です。実際、ステートメント 2 で true が返された場合、ループは実行を継続します。 jsでは、条件判定として0,null,unknown,false,'',""を使用すると結果は偽となり、i-が0に達すると偽となりループが終了します。 🎜🎜記事冒頭のコードに戻る🎜🎜🎜🎜rrreee🎜このrule = rules[i++]が判定条件となり、未定義になった場合にループを終了します。このコードを普通に書くと次​​のようになります: 🎜🎜🎜🎜rrreee🎜 実際には、判断と代入を一緒にして、ループ中に値を代入しているだけです。とても簡単なことではありませんか？ 🎜

以上がJavaScript での for ループの記述は実行効率にどのような影響を与えますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。