Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
2Sum array: for vs forEach vs for..in vs for..of vs reduce
(version: 0)
Compare loop performance
Comparing performance of:
for vs foreach vs for in vs for..of vs reduce
Created:
one year ago
by:
Guest
Jump to the latest result
Script Preparation code:
var array = new Array(100); for (let i = 0; i < 100; i++) { array[i] = i * i; }
Tests:
for
let sum = 0 for (let i = 0, l = array.length; i < l; i++) { sum += array[i]; }
foreach
let sum = 0; array.forEach(function(i) { sum += array[i]; });
for in
let sum = 0; for (var i in array) { sum += array[i]; }
for..of
let sum = 0; for (var i of array) { sum += array[i]; }
reduce
array.reduce((a, b) => a + b, 0);
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
reduce
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
one year ago
)
User agent:
Mozilla/5.0 (iPhone; CPU iPhone OS 17_6_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.6 Mobile/15E148 Safari/604.1
Browser/OS:
Mobile Safari 17 on iOS 17.6.1
View result in a separate tab
Embed
Embed Benchmark Result
Test name
Executions per second
for
337955.8 Ops/sec
foreach
225454.9 Ops/sec
for in
234273.3 Ops/sec
for..of
236524.2 Ops/sec
reduce
6406056.0 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the test cases and explain what's being tested. **General Overview** The benchmark measures the performance of different loop methods in JavaScript: `for`, `forEach`, `for...in`, `for...of`, and `reduce`. The test case uses an array of 100 elements, where each element is a squared value (`i * i`). **Loop Methods Compared** Here's what each loop method does: 1. **For Loop**: Iterates over the array using an index variable (`let i = 0;`) and checks if the index is within the bounds of the array. 2. **forEach**: Iterates over the array, calling a provided callback function for each element. 3. **For...in**: Iterates over the array's properties (i.e., its elements) using an iterator object (`for (var i in array)`). 4. **For...of**: Iterates over the array's elements using a special syntax (`for (var i of array)`). 5. **Reduce**: Accumulates values from an array, reducing it to a single output value. **Pros and Cons** Here are some pros and cons for each loop method: 1. **For Loop**: * Pros: Fast, efficient, and flexible. * Cons: Can be verbose and error-prone if not used correctly. 2. **forEach**: * Pros: Easy to use and readable, especially with arrow functions. * Cons: May have performance overhead due to the callback function's execution. 3. **For...in**: * Pros: Allows iterating over both properties and values of an object (not just its elements). * Cons: Can be slower than other methods due to the iteration process. 4. **For...of**: * Pros: Elegant, readable, and efficient for iterating over arrays. * Cons: Only available in modern browsers and JavaScript engines. 5. **Reduce**: * Pros: Accumulates values from an array efficiently and concisely. * Cons: Requires the accumulator function to be defined beforehand. **Library Usage** None of the loop methods use any external libraries in this benchmark. **Special JS Features or Syntax** Only **For...of** uses a special syntax (`for (var i of array)`) that's not widely supported. However, since most modern browsers support it, its usage is still reasonable. **Other Considerations** When choosing a loop method, consider the following: * Performance: If speed is critical, `for` or `reduce` might be better choices. * Code readability: If ease of use and understanding are important, `forEach` or `For...of` could be more suitable. * Flexibility: If you need to iterate over both properties and values of an object (not just its elements), use `For...in`. **Alternatives** If you want to test other loop methods, consider adding: 1. **While Loop**: Iterates until a condition is met using a variable that increments or decrements. 2. **Do-While Loop**: Similar to the while loop but with an additional initialization step. 3. **Recursive Functions**: Use recursive functions to iterate over arrays or objects. Keep in mind that some of these alternatives might not be as efficient or readable as the original loop methods, so their usage depends on specific use cases and requirements.
Related benchmarks:
for vs foreach vs some vs for..of vs for cached
for vs foreach for (cached length) vs for..of
For loop vs <Array>.forEach() vs for...of loop
Sum array: for vs forEach vs for..in vs for..of vs reduce
Comments
Confirm delete:
Do you really want to delete benchmark?