How Can I Efficiently Merge JavaScript Objects?

Merging JavaScript Object Properties: A Comprehensive Guide

In JavaScript, merging two objects is often necessary to combine their properties into a single entity. This is particularly useful when working with data from multiple sources or when combining configuration options from different modules.

Built-in Methods

ECMAScript 2018: Object Spread

Object spread operator (...) allows you to easily merge two or more objects. The syntax is as follows:

let merged = {...obj1, ...obj2};

The resulting merged object will contain all the properties from both obj1 and obj2, with later properties overwriting earlier ones.

ECMAScript 2015: Object.assign()

Object.assign(obj1, obj2);

Similar to spread operator, Object.assign() merges properties from obj2 into obj1. However, obj1 will be mutated and returned. Additionally, multiple objects can be merged using this method.

ES5 and Earlier

For compatibility reasons, you can use a for-in loop to merge objects:

for (var attrname in obj2) { obj1[attrname] = obj2[attrname]; }

While this works, it simply adds obj2 properties to obj1 and may overwrite existing ones.

Custom Merge Function

If you need more control over the merge process, you can create a custom function:

function merge_options(obj1, obj2) {
    var obj3 = {};
    for (var attrname in obj1) { obj3[attrname] = obj1[attrname]; }
    for (var attrname in obj2) { obj3[attrname] = obj2[attrname]; }
    return obj3;
}

This function creates a new object based on obj1 and obj2, providing the flexibility to customize the merging behavior.

The above is the detailed content of How Can I Efficiently Merge JavaScript Objects?. For more information, please follow other related articles on the PHP Chinese website!