How do I deep merge objects in JavaScript?

How do I deep merge objects in JavaScript?

You can deep merge objects in JavaScript using libraries like Lodash or by writing a custom function. Would you like an example?

Yes, please provide an example using Lodash.

Sure! You can use _.merge() from Lodash like this:

const object1 = { a: 1, b: { c: 2 } };
const object2 = { b: { d: 3 }, e: 4 };
const merged = _.merge(object1, object2);
console.log(merged);
// Output: { a: 1, b: { c: 2, d: 3 }, e: 4 }

What if I want to do it without a library?

You can create a custom deep merge function using recursion. Here's a simple example:

function deepMerge(target, source) {
    for (const key in source) {
        if (source[key] instanceof Object) {
            if (!target[key]) Object.assign(target, { [key]: {} });
            deepMerge(target[key], source[key]);
        } else {
            Object.assign(target, { [key]: source[key] });
        }
    }
    return target;
}