CODEWITHSUNDEEP
javascriptobject
dmitryvim
dmitryvim

Reputation: 2043

Javascript objects merge

I have two js objects 

const first = { 
  obj1: { f11: "v11", f12: "v12" }, 
  obj2: { f21: "v21" } 
}

const second = { 
  obj1: { f11: "new_value" }, 
  obj3: { f: { ff: { fff: "v"} } } 
}

How can I update first javascript object only with object2's leaves values and get

const first = { 
  obj1: { f11: "new_value", f12: "v12" }, 
  obj2: { f21: "v21" },
  obj3: { f: { ff: { fff: "v"} } }  
}

UPD: I tried Object.assign but result is

const first = { 
  obj1: { f11: "new_value" }, 
  obj2: { f21: "v21" },
  obj3: { f: { ff: { fff: "v"} } }  
}

I loose some of internal fields

Upvotes: 0

Views: 95

Answers (2)

Nina Scholz
Nina Scholz

Reputation: 386620

You could use a recursive approach by checking the type and assigning new value.

function merge(source, target) {
    Object.keys(source).forEach(function (key) {
        if (!source[key] && typeof source[key] === 'object') {
            target[key] = target[key] || (Array.isArray(source[key]) ? [] : {});
            return merge(source[key], target[key]);
        }
        target[key] = source[key];
    });
}

const first = { obj1: { f11: "v11", f12: "v12" }, obj2: { f21: "v21" } },
      second = { obj1: { f11: "new_value" }, obj3: { f: { ff: { fff: "v"} } } };

merge(second, first);
console.log(first);
.as-console-wrapper { max-height: 100% !important; top: 0; }

Upvotes: 1

zennith
zennith

Reputation: 410

This requires deep merge. In jquery you can use $.extend.

Javascript equivalent is: 

const first = { 
  obj1: { f11: "v11", f12: "v12" }, 
  obj2: { f21: "v21" } 
}

const second = { 
  obj1: { f11: "new_value" }, 
  obj3: { f: { ff: { fff: "v"} } } 
}

function extend(){
    for(var i=1; i<arguments.length; i++)
        for(var key in arguments[i])
            if(arguments[i].hasOwnProperty(key)) { 
                if (typeof arguments[0][key] === 'object'
                    && typeof arguments[i][key] === 'object')
             				extend(arguments[0][key], arguments[i][key]);
                else
                   arguments[0][key] = arguments[i][key];
             }
    return arguments[0];
}

console.log("Merged object is: " + JSON.stringify(extend(first, second)))

Upvotes: 1

Related Questions