Benchmark: for..of vs foreach

Script Preparation code:

var arr = new Array(10000).fill(55);

Tests:

for..of
var sum = 0; for (var val of arr) sum += val;
foreach
var sum = 0; arr.forEach(val=>sum += val);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for..of
foreach

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 11 months ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/136.0.0.0 Safari/537.36

Browser/OS: Chrome 136 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
for..of	160612.9 Ops/sec
foreach	79687.6 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 provided benchmark and explain what is being tested, compared, and their pros and cons.

**Benchmark Definition**

The benchmark measures the performance difference between two loop iteration methods: `for...of` and `forEach`.

**Script Preparation Code**

```javascript
var arr = new Array(10000).fill(55);
```

This script creates an array of 10,000 elements with a value of 55.

**Html Preparation Code**

There is no HTML preparation code provided, which means the benchmark only focuses on JavaScript execution.

**Individual Test Cases**

The benchmark consists of two test cases:

1. `for..of`:
```javascript
var sum = 0;
for (var val of arr) {
  sum += val;
}
```
This loop iterates over the array using the `for...of` syntax, which is a more modern and concise way to iterate arrays.

2. `forEach`:
```javascript
arr.forEach(val => sum += val);
```
This loop uses the `forEach()` method, which is another way to iterate over an array in JavaScript.

**What's being compared**

The benchmark compares the execution performance of these two loop iteration methods: `for...of` and `forEach`.

**Pros and Cons**

### for...of

Pros:

* More concise and readable code
* Can be used with arrays, sets, and map objects
* Less prone to errors due to its more structured syntax

Cons:

* Not supported in older browsers or environments that don't support modern JavaScript features
* May not work as expected with certain types of data structures (e.g., typed arrays)

### forEach

Pros:

* Widespread browser support
* Can be used with any array-like object
* More flexible than traditional `for` loops

Cons:

* Less concise and more verbose code compared to `for...of`
* May have performance overhead due to the callback function

**Library**

None of the provided benchmark scripts use external libraries.

**Special JS feature or syntax**

There are no special JavaScript features or syntax mentioned in this benchmark. However, it's worth noting that both `for...of` and `forEach` rely on modern JavaScript features and may not work as expected in older environments.

**Other alternatives**

If you're interested in exploring alternative loop iteration methods, consider the following:

* Traditional `for` loops: `var sum = 0; for (var i = 0; i < arr.length; i++) { sum += arr[i]; }`
* While loops: `var sum = 0; while (i < arr.length) { sum += arr[i]; i++; }`

Keep in mind that these alternatives may not be as concise or readable as `for...of` and `forEach`, but they can still achieve the same results.

Related benchmarks:

for..of vs foreach (version: 0)

Comparing performance of: for..of vs foreach

Created: 9 years ago by: Guest

Jump to the latest result

for..of

foreach

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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