Benchmark: for-in vs object.keys vs object.values for objects perf

Script Preparation code:

var obj =[...new Array(1)].map(x=>({id:x,name:x}));

Tests:

for-in
for (var key in obj) { console.log(obj[key].id); }
Object.keys
Object.keys(obj).forEach(key => console.log(obj[key].id));
Object.values
Object.values(obj).forEach(n => console.log(n.id));

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for-in
Object.keys
Object.values

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: yesterday)

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

Browser/OS: Chrome 147 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
for-in	391588.3 Ops/sec
Object.keys	341647.3 Ops/sec
Object.values	335533.6 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the explanation of the provided JavaScript microbenchmark.

**What is tested?**

The benchmark tests three different approaches to iterate over an object in JavaScript:

1.  **For-in loop**: This approach uses the `for...in` statement to iterate over the object's properties (including inherited ones). It accesses each property using its key.
2.  **Object.keys() and Object.values() methods**: These two methods provide a way to get an array of an object's own enumerable properties and values, respectively.

**Options comparison**

The three approaches have different characteristics that affect their performance:

*   **For-in loop**: This approach iterates over all properties in the object, including inherited ones. It can lead to slower performance due to unnecessary iterations.
*   **Object.keys() and Object.values() methods**: These two methods only iterate over the object's own enumerable properties and values, respectively, which can result in faster performance since they avoid iterating over inherited properties.

**Pros and cons of each approach**

*   **For-in loop:**
    *   Pros:
        *   Simple and easy to understand.
        *   Works well for objects with a small number of properties.
    *   Cons:
        *   Can lead to slower performance due to unnecessary iterations.
        *   Iterates over inherited properties, which may not be desirable in all cases.
*   **Object.keys() and Object.values() methods:**
    *   Pros:
        *   Faster performance since they only iterate over own enumerable properties and values.
        *   More efficient for large objects with many properties.
    *   Cons:
        *   Requires modern JavaScript features (ECMAScript 2015+).
        *   May not work in older browsers or environments that don't support these methods.

**Library usage**

There is no library explicitly mentioned in the provided benchmark definition. However, if you're using libraries like Lodash or others for iterating over objects, it's essential to be aware of their performance implications and choose the most efficient approach accordingly.

**Special JavaScript features/syntax**

The benchmark defines modern JavaScript syntax (e.g., arrow functions (`=>`), template literals (`\r\n`)) that may not work in older browsers or environments. If you need compatibility with older browsers, consider transpiling your code to support these features or using polyfills.

**Other alternatives**

If you're concerned about performance differences between the three approaches:

*   **Array.prototype.forEach()**: This method can be used to iterate over an array of object properties, but it's not as straightforward as the other two approaches.
*   **Object.getOwnPropertyNames() and Object.getOwnPropertyValues() methods**: These methods provide a way to get an array of all own enumerable property names and values, including inherited ones. However, they might lead to slower performance due to unnecessary iterations.

In conclusion, the benchmark provides insight into the performance differences between for-in loop, Object.keys(), and Object.values() methods when iterating over objects in JavaScript. Choosing the most efficient approach depends on your specific use case, target browser support, and personal preference.

Related benchmarks:

for-in vs object.keys vs object.values for objects perf (version: 0)

Comparing performance of: for-in vs Object.keys vs Object.values

Created: 3 years ago by: Registered User

Jump to the latest result

for-in

Object.keys

Object.values

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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