Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
forEach vs for each vs for of vs for let
(version: 1)
Comparing performance of:
traditional vs array method vs of vs in
Created:
2 years ago
by:
Registered User
Go to the latest result
Script Preparation code:
var count = 100000 var arr = Array.from({length: count});
Tests:
traditional
for(let i=0; i<count; i++){ const x = i; }
array method
arr.forEach(r => { const x = i; })
of
for (let each of arr) { const x = each; }
in
for (let each in arr) { const x = each; }
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (4)
Previous results
Fork
Test case name
Result
traditional
array method
of
in
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
2 years ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 Safari/537.36
Browser/OS:
Chrome 126 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=531337" width="100%" height="500px"></iframe>
array method
26K/s
of
19K/s
in
415/s
traditional
308/s
View exact numbers
Test name
Executions per second
✓
array method
25,759 Ops/sec
of
18,716 Ops/sec
in
415 Ops/sec
traditional
308 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down what is being tested in this benchmark. **Script Preparation Code** The script preparation code sets up the test environment by creating an array of length 100,000 and assigning it to a variable named `arr`. ```javascript var count = 100000; var arr = Array.from({length: count}); ``` This creates an array that is large enough to cause significant performance differences between different iteration methods. **Test Cases** There are four test cases: 1. **Traditional Loop** ```javascript for(let i=0; i<count; i++) { const x = i; } ``` This is a traditional loop using a `for` loop with an index variable `i`. 2. **Array Method** ```javascript arr.forEach(r => { const x = i; }) ``` This uses the `forEach` method of the array to iterate over its elements. 3. **Of Loop** ```javascript for (let each of arr) { const x = each; } ``` This is an example of a "of" loop, which was introduced in ECMAScript 2019 as part of the Object First engine. This type of loop iterates over the elements of an array using a foreach-like syntax. 4. **In Loop** ```javascript for (let each in arr) { const x = each; } ``` This is a traditional `for...in` loop that iterates over the properties of an object, including arrays. **Comparison** The benchmark compares the performance of these four iteration methods on a large array. The results will likely show significant differences between them due to their different syntax and implementation details. **Pros and Cons** Here are some pros and cons of each approach: * **Traditional Loop**: Pros: widely supported, easy to understand. Cons: can be slow for large arrays, may have performance issues with certain data types. * **Array Method**: Pros: concise, modern syntax. Cons: may not work in older browsers or environments that don't support `forEach`. * **Of Loop**: Pros: concise, modern syntax. Cons: may not work in older browsers or environments that don't support "of" loops. * **In Loop**: Pros: can be used for iterating over objects with inherited properties. Cons: can be slow and confusing to use. **Library/Functionality** None of the test cases use a specific library or functionality, they only rely on built-in JavaScript features. **Special JS Features/Syntax** Only one special feature is used in this benchmark: * **ECMAScript 2019 "of" loop**: This is a new type of loop introduced in ECMAScript 2019 that iterates over the elements of an array using a foreach-like syntax. It's not widely supported yet and may require specific browsers or environments to work. **Alternatives** Other alternatives for iterating over arrays include: * Using `map()`, `filter()`, and other array methods instead of loops. * Using `while` loops with indices, which can be more efficient than traditional `for` loops. * Using functional programming techniques like reducing functions or using `reduce()`. Note that the best approach will depend on the specific requirements of the use case and the performance characteristics of the data being iterated over.
Related benchmarks
Iteration through array; of vs forEach
for (i < n) vs forEach vs for...of
For loop vs <Array>.forEach() vs for...of loop
forEach vs for of 7
Comments
Confirm delete:
Do you really want to delete benchmark?