Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
for vs foreach vs for..in vs for..of zzz4
(version: 0)
Compare loop performance
Comparing performance of:
for vs foreach vs for in vs for..of vs for2
Created:
one year ago
by:
Guest
Go to the latest result
Script Preparation code:
var array = new Array(100000); for (let i = 0; i < 100000; ++i) { array[i] = i; }
Tests:
for
let s = 0; for (var i = 0; i < array.length; i++) { s+=array[i]; } console.log(s)
foreach
let s = 0; array.forEach(function(n) { s+=n; }); console.log(s)
for in
let s = 0; for (const n in array) { s+=n; } console.log(s)
for..of
let s = 0; for (const n of array) { s+=n; } console.log(s)
for2
let s = 0; for (let i = 0; i < array.length; i++) { s+=array[i]; } console.log(s)
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (5)
Previous results
Fork
Test case name
Result
for
foreach
for in
for..of
for2
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
one year ago
)
User agent:
Mozilla/5.0 (Android 13; Mobile; rv:129.0) Gecko/129.0 Firefox/129.0
Browser/OS:
Firefox Mobile 129 on Android
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=552828" width="100%" height="500px"></iframe>
for2
3K/s
for
3K/s
for..of
911/s
foreach
596/s
for in
58/s
View exact numbers
Test name
Executions per second
✓
for2
2,786 Ops/sec
for
2,746 Ops/sec
for..of
911 Ops/sec
foreach
596 Ops/sec
for in
58 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
I'll explain the benchmark and its test cases. **Benchmark Purpose** The benchmark is designed to compare the performance of different loop constructs in JavaScript: `for`, `foreach`, `for...in`, and `for...of`. The goal is to determine which loop construct is most efficient for iterating over an array. **Options Compared** There are four options being compared: 1. **Traditional `for` loop**: This loop uses a traditional `for` loop syntax, where the loop counter variable is declared outside the loop. 2. **`foreach` loop**: This loop uses the `forEach` method provided by arrays in JavaScript. It's a more modern and concise way of iterating over an array. 3. **`for...in` loop**: This loop uses a `for...in` loop syntax, which is often used to iterate over object properties. However, it can also be used for arrays. 4. **`for...of` loop**: This loop uses a more modern and concise way of iterating over arrays, introduced in ECMAScript 2015 (ES6). It's specifically designed for array iteration. **Pros and Cons** Here are some pros and cons of each option: * **Traditional `for` loop**: + Pros: Wide browser support, easy to understand and debug. + Cons: Can be slower due to the overhead of declaring a new variable. * **`foreach` loop**: + Pros: Concise syntax, well-suited for array iteration. + Cons: May not be as efficient as traditional `for` loops in older browsers. * **`for...in` loop**: + Pros: Can be used for both object and array iteration, flexible syntax. + Cons: May be slower than traditional `for` loops due to the overhead of iterating over object properties. * **`for...of` loop**: + Pros: Concise syntax, well-suited for array iteration, good browser support. + Cons: Introduced in ES6, may not work in older browsers. **Library and Special JS Features** None of the test cases use any external libraries. However, some options do use special JavaScript features: * **`foreach` loop**: Uses the `forEach` method provided by arrays, which is a built-in feature. * **`for...of` loop**: Uses the `for...of` loop syntax, introduced in ES6. **Other Considerations** When choosing between these loop constructs, consider the following factors: * Browser support: If you need to support older browsers, traditional `for` loops may be a better choice. * Code readability and maintainability: Concise syntax can make your code more readable, but may also increase complexity if not used carefully. * Performance: Traditional `for` loops may be faster than modern loop constructs due to the overhead of new variable declarations. **Alternatives** If you're looking for alternative loop constructs in JavaScript, consider: * **Array.prototype.every()**: A more concise way of iterating over arrays and testing each element against a condition. * **Array.prototype.some()**: Similar to `every()`, but tests whether at least one element meets the condition. * **Array.prototype.map()`: Transforms an array by applying a function to each element. These alternatives can be used in place of traditional loops, especially when working with arrays.
Related benchmarks
foreach vs for..of
For loop vs <Array>.forEach() vs for...of loop
for vs foreach vs for..in vs for..of zzz2
for vs foreach vs for..in vs for..of zzz3
Comments
Confirm delete:
Do you really want to delete benchmark?