Benchmark: 2Sum array: for vs forEach vs for..in vs for..of vs reduce

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>

Previous results

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

reduce

6.4M/s

for

338K/s

for..of

237K/s

for in

234K/s

foreach

225K/s

View exact numbers

Test name	Executions per second
✓ reduce	6,406,056 Ops/sec
for	337,956 Ops/sec
for..of	236,524 Ops/sec
for in	234,273 Ops/sec
foreach	225,455 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

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.

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

Go to the latest result

for

foreach

for in

for..of

reduce

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

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

Go to the latest result

for

foreach

for in

for..of

reduce

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

Related benchmarks

Comparing performance of: `for vs foreach vs for in vs for..of vs reduce`