Benchmark: JavaScript Object.assign vs for in loop vs for of loop vs Object.entries

Tests:

Object.assign
const a = { x: 'xxx', y: 1, z: null } const b = { z: 1, u: 'uuu', v: null } Object.assign(a, b);
for in loop
const a = { x: 'xxx', y: 1, z: null } const b = { z: 1, u: 'uuu', v: null } for (const prop in b) { if (b.hasOwnProperty(prop)) { a[prop] = b[prop]; } }
for of loop
const a = { x: 'xxx', y: 1, z: null } const b = { z: 1, u: 'uuu', v: null } for (const prop of Object.keys(b)) { a[prop] = b[prop]; }
for Object entries
const a = { x: 'xxx', y: 1, z: null } const b = { z: 1, u: 'uuu', v: null } for (const [key, value] of Object.entries(b)) { a[key] = value; }
for in without check
const a = { x: 'xxx', y: 1, z: null } const b = { z: 1, u: 'uuu', v: null } for (const prop in b) { a[prop] = b[prop]; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Object.assign
for in loop
for of loop
for Object entries
for in without check

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Let's break down what's being tested in this benchmark.

The test is comparing four different approaches to merge two objects: `Object.assign`, `for in loop`, `for of loop`, and `for Object entries`.

**1. Object.assign**

`Object.assign()` is a built-in JavaScript method that copies the properties of one or more source objects into a target object. In this benchmark, it's being used to merge two objects, `a` and `b`, where `a` has some properties with null values, and `b` has some properties with different values.

**Pros:**

* Simple and concise syntax.
* Well-documented and widely supported.
* Fast execution, as it uses a native function.

**Cons:**

* Can be slower than other approaches for large objects or when dealing with nested objects.
* Does not handle null source objects well (e.g., will throw an error).

**2. For in loop**

The `for in` loop is used to iterate over the properties of an object. In this benchmark, it's being used to merge two objects by iterating over the properties of `b` and assigning each property value to `a`. However, it includes a check using `hasOwnProperty()` to avoid modifying inherited properties.

**Pros:**

* Handles null source objects well.
* Can be faster than other approaches for large objects.

**Cons:**

* More verbose syntax compared to `Object.assign()`.
* May be slower due to the use of an iteration loop.
* Requires manual handling of property names.

**3. For of loop**

The `for...of` loop is used to iterate over arrays or iterables, but it can also be used with objects using `Object.entries()` or other methods that return an array-like object. In this benchmark, it's being used with `Object.entries()` to merge two objects.

**Pros:**

* More concise syntax compared to the `for in` loop.
* Handles arrays and other iterables well.
* Can be faster than other approaches for large objects.

**Cons:**

* Less flexible than `for in` due to its reliance on `Object.entries()`.
* May be slower due to the use of an iteration loop.

**4. For Object entries**

This is a variant of the `for...of` loop used specifically with `Object.entries()` to iterate over the properties of an object.

**Pros:**

* More concise syntax compared to the `for in` loop.
* Handles arrays and other iterables well.
* Can be faster than other approaches for large objects.

**Cons:**

* Less flexible than `for in` due to its reliance on `Object.entries()`.
* May be slower due to the use of an iteration loop.

The benchmark measures the execution speed of each approach, with Firefox 111 as the test browser. The results show that:

1. `For in without check` is the fastest.
2. `Object.assign()` is relatively fast but slower than the `for` loops.
3. `For in loop` and `For Object entries` are similar in performance but slightly slower than `Object.assign()`.
4. `For of loop` is slower due to its overhead.

Other alternatives to these approaches include:

* Using the spread operator (`{...a, ...b}`)
* Using a library like Lodash's `merge` function
* Using a different merging approach altogether (e.g., using recursion or a custom implementation)

Note that the choice of approach depends on the specific requirements of your use case. For example, if you need to merge large objects, one of the more efficient approaches might be preferred. If conciseness is important, `Object.assign()` or `for...of` with `Object.entries()` might be a better choice.

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:109.0) Gecko/20100101 Firefox/111.0

Browser/OS: Firefox 111 on Mac OS X 10.15

View result in a separate tab

Test name	Executions per second
Object.assign	11592283.0 Ops/sec
for in loop	17092460.0 Ops/sec
for of loop	7126999.0 Ops/sec
for Object entries	4244930.5 Ops/sec
for in without check	19349014.0 Ops/sec

Related benchmarks:

JavaScript Object.assign vs for in loop vs for of loop vs Object.entries (version: 0)

Comparing performance of: Object.assign vs for in loop vs for of loop vs for Object entries vs for in without check

Created: one year ago by: Guest

Jump to the latest result

Object.assign

for in loop

for of loop

for Object entries

for in without check

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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