Benchmark: for-in vs object.values for objects

Script Preparation code:

var obj = {
  'a': {
    id: 'a',
    num: 1
  },
  'b': {
    id: 'b',
    num: 1
  },
  'c': {
    id: 'c',
    num: 1
  },
  'd': {
    id: 'd',
    num: 1
  },
  'e': {
    id: 'e',
    num: 1
  },
  'f': {
    id: 'f',
    num: 1
  },
  'g': {
    id: 'g',
    num: 1
  },
};

Tests:

for-in
for (var i=10000; i > 0; i--) { for (var key in obj) { if (obj.hasOwnProperty(key)) { console.log(obj[key].id); } } }
Object.values
for (var i=10000; i > 0; i--) { 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.values

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 3 years ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.164 Safari/537.36

Browser/OS: Chrome 91 on Windows

View result in a separate tab

Test name	Executions per second
for-in	3.0 Ops/sec
Object.values	2.1 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and explain what is being tested.

**Benchmark Overview**

The provided benchmark compares two approaches for iterating over an object in JavaScript:

1. The traditional `for-in` loop
2. Using `Object.values()` to get an array of values from the object

**For-In Loop**

The `for-in` loop is a legacy way of iterating over an object's properties in JavaScript. It iterates over the object's own enumerable properties, not its own methods or symbols. The loop uses the property name as the iteration variable.

Pros:

* Wide compatibility across older browsers and systems.
* Can be used with objects that have both numerical and string keys.

Cons:

* Iterates over all properties, including those that might not be what you expect (e.g., inherited properties).
* Not suitable for objects with large numbers of properties or complex structures.
* Can be slower than other approaches due to the overhead of property iteration.

**Object.values()**

`Object.values()` is a modern method introduced in ECMAScript 2017 (ES7) that returns an array containing all values of an object. This approach avoids the issues associated with `for-in` loops and provides a more predictable and efficient way to iterate over an object's properties.

Pros:

* More predictable and efficient iteration.
* Only iterates over own enumerable properties, excluding inherited ones.
* Suitable for objects with large numbers of properties or complex structures.
* Wide adoption in modern browsers and systems.

**Library: undefined**

There is no library used in this benchmark. The `Object.values()` method is a built-in part of the JavaScript language.

**Special JS Feature/Syntax: None**

This benchmark does not use any special JavaScript features or syntax, such as async/await, generators, or modules.

**Other Alternatives**

If you need to iterate over an object's properties in JavaScript, other alternatives to `for-in` loops and `Object.values()` include:

* Using a `forEach` loop with the `in` operator: `for (var key in obj) { obj[key].forEach(n => console.log(n.id)); }`
* Using `Object.keys()` and `map()`: `Object.keys(obj).map(key => console.log(obj[key].id))`
* Using `for...of` loops: `for (const key of Object.keys(obj)) { console.log(obj[key].id); }`

These alternatives provide different trade-offs in terms of performance, readability, and compatibility.

Related benchmarks:

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

Comparing performance of: for-in vs Object.values

Created: 3 years ago by: Guest

Jump to the latest result

for-in

Object.values

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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