Benchmark: Object loops: for...in vs Object.keys+forEach (ES5) vs for...of (ES6) vs Object.entries (ES8)

Script Preparation code:

var obj = {};
for (let i = 0; i < 1000; i++) {
  obj['abc_' + i] = i;
}

function foo(bar) {
  return bar * 2 * 2;
}

Tests:

for...in
for (const key in obj) { if (obj.hasOwnProperty(key)) foo(obj[key]); }
Object.keys+forEach (ES5)
Object.keys(obj).forEach(function(key) { foo(obj[key]); });
for...of - keys (ES6)
for (const key of Object.keys(obj)) { foo(obj[key]); }
for...of - values (ES6)
for (const value of Object.values(obj)) { foo(value); }
for...of - entries (ES8)
for (const [key, value] of Object.entries(obj)) { foo(value); }
Object.entries (ES8)
Object.entries(obj).forEach(function(key, value) { foo(value); });

Historical Performance Data aggregated from 18 community runs

Desktop Results:

Chrome 12 runs

for...of - keys (ES6)

9K/s

Object.keys+forEach (ES5)

9K/s

for...of - values (ES6)

8K/s

Object.entries (ES8)

7K/s

for...of - entries (ES8)

7K/s

for...in

6K/s

Fastest: for...of - keys (ES6) (1.5x faster)

View exact numbers

✓ for...of - keys (ES6): 9,017 ops/sec
• Object.keys+forEach (ES5): 8,923 ops/sec
• for...of - values (ES6): 7,703 ops/sec
• Object.entries (ES8): 6,775 ops/sec
• for...of - entries (ES8): 6,751 ops/sec
• for...in: 6,097 ops/sec

Firefox 6 runs

for...of - values (ES6)

119K/s

Object.keys+forEach (ES5)

53K/s

for...in

49K/s

Object.entries (ES8)

49K/s

for...of - keys (ES6)

48K/s

for...of - entries (ES8)

45K/s

Fastest: for...of - values (ES6) (2.6x faster)

View exact numbers

✓ for...of - values (ES6): 119,242 ops/sec
• Object.keys+forEach (ES5): 52,833 ops/sec
• for...in: 49,135 ops/sec
• Object.entries (ES8): 48,848 ops/sec
• for...of - keys (ES6): 48,197 ops/sec
• for...of - entries (ES8): 45,138 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for...in
Object.keys+forEach (ES5)
for...of - keys (ES6)
for...of - values (ES6)
for...of - entries (ES8)
Object.entries (ES8)

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Mobile Safari/537.36

Browser/OS: Chrome Mobile 143 on Android

View result in a separate tab

Object.keys+forEach (ES5)

9K/s

for...of - keys (ES6)

9K/s

for...in

6K/s

for...of - values (ES6)

3K/s

for...of - entries (ES8)

3K/s

Object.entries (ES8)

3K/s

View exact numbers

Test name	Executions per second
✓ Object.keys+forEach (ES5)	9,084 Ops/sec
for...of - keys (ES6)	8,973 Ops/sec
for...in	6,012 Ops/sec
for...of - values (ES6)	3,268 Ops/sec
for...of - entries (ES8)	2,660 Ops/sec
Object.entries (ES8)	2,633 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 its test cases.

**Benchmark Overview**

The benchmark compares the performance of different ways to iterate over an object in JavaScript, specifically when working with built-in methods like `Object.keys()`, `forEach()`, and the new `for...of` syntax introduced in ES6. The goal is to determine which approach is most efficient for accessing and processing values within an object.

**Options Compared**

The benchmark tests six different approaches:

1. **For...in**: Using the traditional `for...in` loop, which iterates over both enumerable and non-enumerable properties of the object.
2. **Object.keys+forEach (ES5)**: Utilizing the `Object.keys()` method to get an array of enumerable property names and then using the `forEach()` method to iterate over those names.
3. **For...of - keys (ES6)**: Using the new `for...of` loop with the `keys()` method, which allows iterating over the object's own enumerable properties as key-value pairs.
4. **For...of - values (ES6)**: Employing the same `for...of` loop but using the `values()` method to iterate directly over the object's own enumerable values.
5. **For...of - entries (ES8)**: Leveraging the `entries()` method, which returns an array of key-value pairs, and then iterating over those pairs with a `for...of` loop.
6. **Object.entries (ES8)**: Similar to the previous option but using the `entries()` method directly within the `for...of` loop.

**Pros and Cons**

Here's a brief summary of each approach:

*   **For...in**: Pros - simple, well-known syntax; Cons - may include non-enumerable properties.
*   **Object.keys+forEach (ES5)**: Pros - flexible, can filter out non-enumerable properties using `.filter()`; Cons - less efficient due to array manipulation and method calls.
*   **For...of - keys (ES6)**: Pros - concise, easy to read; Cons - may be less intuitive for developers not familiar with the new syntax.
*   **For...of - values (ES6)**: Pros - concise, easy to read; Cons - may require additional processing to access object properties by value.
*   **For...of - entries (ES8)**: Pros - direct and efficient way to iterate over key-value pairs; Cons - requires support for ES8 syntax and methods.
*   **Object.entries (ES8)**: Pros - similar efficiency to `for...of - entries`; Cons - may be less familiar or intuitive for some developers.

**Library Usage**

None of the test cases explicitly use any external libraries. They rely solely on built-in JavaScript features and DOM elements (in case of the preparation code).

**Special JS Features/Syntax**

*   **For-of loops**: Introduced in ECMAScript 2015 (ES6), these loops provide a more concise way to iterate over sequences.
*   **Object entries method**: Introduced in ECMAScript 2017 (ES8), this method returns an array-like object containing the key-value pairs of the object.

**Other Alternatives**

In addition to the options tested, other approaches might include:

*   Using traditional `for` loops with indexing or `Array.prototype.forEach()`.
*   Leveraging libraries like Lodash for utility functions and iteration methods.
*   Exploring alternative data structures, such as arrays or sets, for faster lookups.

Keep in mind that performance differences may vary depending on the specific use case, hardware, and software environment.

Object loops: for...in vs Object.keys+forEach (ES5) vs for...of (ES6) vs Object.entries (ES8) (version: 7)

Comparing performance of: `for...in vs Object.keys+forEach (ES5) vs for...of - keys (ES6) vs for...of - values (ES6) vs for...of - entries (ES8) vs Object.entries (ES8)`

Created: 7 years ago by: Registered User

Go to the latest result

for...in

Object.keys+forEach (ES5)

for...of - keys (ES6)

for...of - values (ES6)

for...of - entries (ES8)

Object.entries (ES8)

Historical Performance Data aggregated from 18 community runs

Desktop Results:

Chrome 12 runs

Firefox 6 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Object loops: for...in vs Object.keys+forEach (ES5) vs for...of (ES6) vs Object.entries (ES8) (version: 7)

Comparing performance of: for...in vs Object.keys+forEach (ES5) vs for...of - keys (ES6) vs for...of - values (ES6) vs for...of - entries (ES8) vs Object.entries (ES8)

Created: 7 years ago by: Registered User

Go to the latest result

for...in

Object.keys+forEach (ES5)

for...of - keys (ES6)

for...of - values (ES6)

for...of - entries (ES8)

Object.entries (ES8)

Historical Performance Data aggregated from 18 community runs

Desktop Results:

Chrome 12 runs

Firefox 6 runs

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...in vs Object.keys+forEach (ES5) vs for...of - keys (ES6) vs for...of - values (ES6) vs for...of - entries (ES8) vs Object.entries (ES8)`