const firstObject = { sampleData: 'Hello world' }
const secondObject = { moreData: 'foo bar' }
const finalObject = {
firstObject,
secondObject
};
const firstObject = { sampleData: 'Hello world' }
const secondObject = { moreData: 'foo bar' }
const finalObject = Object.assign({}, firstObject, secondObject);
const firstObject = { sampleData: 'Hello world' }
const secondObject = { moreData: 'foo bar' }
const finalObject = {}
for (let key in firstObject) {
finalObject[key] = firstObject[key];
}
for (let key in secondObject) {
finalObject[key] = secondObject[key];
}
const firstObject = { sampleData: 'Hello world' }
const secondObject = { moreData: 'foo bar' }
const finalObject = {}
if (firstObject != null) {
for (let key in firstObject) {
if (Object.prototype.hasOwnProperty.call(firstObject, key)) {
finalObject[key] = firstObject[key];
}
}
}
if (secondObject != null) {
for (let key in secondObject) {
if (Object.prototype.hasOwnProperty.call(secondObject, key)) {
finalObject[key] = secondObject[key];
}
}
}
--enable-precise-memory-info
flag.
Test case name | Result |
---|---|
Using the spread operator | |
Using Object.assign | |
Using For-In loop | |
Using For-In loop with type checks |
Test name | Executions per second |
---|---|
Using the spread operator | 5106751.0 Ops/sec |
Using Object.assign | 10110171.0 Ops/sec |
Using For-In loop | 74083856.0 Ops/sec |
Using For-In loop with type checks | 5852321.0 Ops/sec |
Let's break down the benchmark and explain what is being tested.
Benchmark Overview
The benchmark compares the performance of three approaches to merge two objects into one, without mutating either object:
...
): This approach uses the spread operator to create a new object with the properties from both input objects.Object.assign()
: This approach uses the Object.assign()
method to copy the properties of one object and assign them to another object.for-in
loop: This approach uses a for-in
loop to iterate over the properties of both input objects, and assigns the values to a new object only if the property is not null.Options Compared
The three options are compared in terms of their execution speed and performance. The benchmark measures the number of executions per second for each option on different browsers and devices.
Pros and Cons of Each Approach
...
):Object.assign()
:for-in
loop:Library Used
In this benchmark, Object.assign()
is used, which is a standard method in JavaScript for copying properties from one object to another. The use of Object.assign()
implies that the benchmark is running on modern browsers or environments that support this method.
Special JS Feature/Syntax
There are no special JS features or syntax mentioned in the benchmark definition, as it only involves standard JavaScript concepts and libraries.
Alternatives
If you want to explore alternative approaches for merging objects without mutation, some other options could be:
Object.create()
with an object literalmerge()
functionKeep in mind that the choice of approach depends on your specific use case and requirements. The benchmark results can provide insights into which approach is most efficient for your particular scenario.