JavaScript의 for 루프 작성은 실행 효율성에 어떤 영향을 미치나요?
- 伊谢尔伦원래의
- 2017-07-19 14:40:572448검색
for 루프 작성이 효율성에 미치는 영향
일반적으로 for 루프를 작성하는 방법에는 두 가지가 있습니다:
변수 선언 없이 작성:
for(var i = 0;i<arr .length; i++){}for(var i = 0;i<arr.length;i++){}写声明变量的写法：
for(var i = 0,len = arr.length;i < len;i++){}
除了for循环还有forEach() ，也有文章说forEach()效率最高，推荐用forEach()写法，那么到底哪个效率高呢？做个测试来看看吧。
测试方案
总的测试方案如下：
做一个容纳4千万的测试数组变量。
分别用两种写法的for循环和foreach对这个测试变量进行遍历。
在同一台稳定机器上，进行10次测试，最后取平均值。
测试环境：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('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);
测试结果
经过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() 작성 방법 중 어느 것이 더 효율적인가요? 테스트를 해보고 살펴보겠습니다.
- 테스트 계획
- 전체 테스트 계획은 다음과 같습니다.
- 4천만개를 담는 테스트 배열 변수를 만듭니다.
이 테스트 변수를 탐색하려면 for 루프와 foreach의 두 가지 작성 방법을 사용하세요.
동일한 안정적인 머신에서 10번의 테스트를 수행하고 최종적으로 평균을 구합니다.
테스트 프로세스
테스트 변수 만들기
먼저 잠시 사용하세요 loop 테스트 변수를 만듭니다. 자세한 내용은 다음과 같습니다.
for (语句 1; 语句 2; 语句 3)
{
被执行的代码块
}해당 테스트 함수를 작성합니다.🎜🎜🎜시간을 측정하고 실행하는 코드입니다. /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번의 테스트 결과 다음과 같은 결과가 나왔습니다🎜len = arr.length 이 arr.length가 캐시되었을 수 있으므로 저장을 위해 len 변수를 선언하는 것은 의미가 없습니다. 🎜🎜🎜for 루프를 작성하는 특별한 방법🎜🎜🎜for 루프의 기본 구문은 다음과 같습니다.🎜🎜🎜🎜rrreee🎜🎜🎜문 1: 루프(코드 블록)가 시작되기 전에 실행🎜🎜🎜🎜문 2: 실행 루프(코드 블록) 조건 정의 🎜🎜🎜🎜 명령문 3: 루프(코드 블록)가 실행된 후 실행됨 🎜🎜🎜🎜🎜 for 루프를 사용하여 1~10을 출력하면 다음과 같이 작성할 수 있습니다. 🎜🎜 🎜🎜rrreee🎜 그런데! 위의 문법적 지시에 따르면 이렇게도 쓸 수 있어요🎜🎜🎜🎜rrreee🎜처음 읽었을 때 헷갈렸는데, 어떻게 이렇게 쓸 수 있지? 명령문 2에는 루프 조건이 포함되어 있으며 i-는 판단 조건입니다. 실제로 명령문 2에서 true가 반환되면 루프가 계속 실행됩니다. js에서는 0,null,undefine,false,'',""를 조건부 판단으로 사용하면 결과가 false가 되는데, 이는 i-가 0에 도달하면 false가 되어 루프가 종료된다는 의미입니다. 🎜🎜글 시작 부분의 코드로 돌아갑니다🎜🎜🎜🎜rrreee🎜이 규칙 = rule[i++]이 정의되지 않으면 루프가 종료됩니다. 그래서 이 코드를 일반적인 방법으로 작성하면 다음과 같을 것입니다. 🎜🎜🎜🎜rrreee🎜실제로는 판단과 할당을 함께 두고, 루프를 돌면서 값을 할당하는 것뿐입니다. 아주 간단하지 않나요? 🎜위 내용은 JavaScript의 for 루프 작성은 실행 효율성에 어떤 영향을 미치나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!