How to combine 2 objects with same properties-Javascript

Question

I want to be able to merge two JavaScript objects with same properties/keys defined. Just that the values are not duplicate. For example I'd like to:

 var obj1 = { 
0:{id: 33, name: 'abc', date: "12/12/12", type:"11" },
1: {id: 33, name: 'abc3', date: "12/13/12", type:"131"}
}
var obj2 = { 
0:{id: 22, name: 'abc1', date: "12/1/13", type: "33" }
1:{id: 4, name: 'abc4', date: "12/4/12", type:"14"}
}

here is the fiddle: http://jsfiddle.net/q9c8k2yh/ this is the expected structure:

enter image description here I want the o/p to be:

var obj3 = {
 0: { id: 33, name: 'abc', date: "12/12/12", type:"11" },
1: { id: 22, name: 'abc1', date: "12/1/13", type: "33" }
}

I looked up at the sources online and the most common answer I get:

Object.assign(obj2, obj1);

I have tried:

obj3 = Object.assign(obj2, obj1);//returns { id: 33, name: 'abc', date: "12/12/12", type:"11" }
obj3 = Object.assign(obj1, obj2);//return { id: 22, name: 'abc1', date: "12/1/13", type: "33" }
obj3 = Object.assign({},obj2, obj1); //return { id: 33, name: 'abc', date: "12/12/12", type:"11" }

but none of them gives me both the objects. I do not want to replace one over the other. is there a way to achieve this?

Thanks!

• jonrsharpe: What you're describing is not merging them.
• esqew: Are you looking to combine them into an Array?
• user1234: no I want to maintain its type as Object
• Jeto: {0: obj1, 1: obj2}? If you have a small definite number of them at least.
• connexo: You want to clone them or hold references to them?

Answer 1

What you are describing looks more like an array than an object. But if you want an Object with numeric keys, well you can do that:

var obj1 = { id: 33, name: 'abc', date: "12/12/12", type:"11" }
var obj2 = { id: 22, name: 'abc1', date: "12/1/13", type: "33" }
let arr = [obj1, obj2]
// turn array into object:
let obj_all = {...arr}
console.log(obj_all)

The new object will hold references to the old objects. It's not clear if that's what you are after, or if you want clones.

To make clones you could of course spread the objects:

var obj1 = { id: 33, name: 'abc', date: "12/12/12", type:"11" }
var obj2 = { id: 22, name: 'abc1', date: "12/1/13", type: "33" }
let arr = [{...obj1}, {...obj2}]
let obj_all = {...arr}
// changes in original objects have no effect on clones
obj1.id="New Value"
console.log(obj_all)

• Jeto: Just a note: can be done in one line if necessary: {...[obj1, obj2]}.
• connexo: The on-liner for clones would be {...[{...obj1}, {...obj2}]}.

Answer 2

Sounds like you're looking for a hash map instead of merging 2 objects:

var obj3 = {
 0: obj1,
 1: obj2
}

Object.assign merges on top the prior argument, where the first argument is the object to replace, so:

Object.assign(obj2, obj1);

Replaces obj2 with itself and obj1 shallowly merged over it.

Answer 3

You can clone them easily using object rest spread (ES 2018):

var obj1 = { id: 33, name: 'abc', date: "12/12/12", type:"11" }
var obj2 = { id: 22, name: 'abc1', date: "12/1/13", type: "33" }
var obj3 = {
 0: { ...obj1 },
 1: { ...obj2 }
}
console.log(obj3);

Now if you change obj1 it won't change obj3["0"].

Answer 4

Seems like you want to create a new object having integer values as keys and value as requested object

var arrayOfObjects = [obj1, obj2]; //put here object you want to 'merge'
var result = Object.assign({}, arrayOfObjects);

Or in case you need a function. It'll look like:

function merge(arrayOfObjects){
 return object.assign({}, arrayOfObjects);
} 

Answer 5

Another approach might be this. Stringifies the item and parses it so to make deep clone.

var obj1 = { id: 33, name: 'abc', date: "12/12/12", type:"11" }
var obj2 = { id: 22, name: 'abc1', date: "12/1/13", type: {
 id: 3
} }
const mergeWithReference = (...args) => {
 return args.reduce((acc,item,index) => {
 acc[index] = JSON.parse(JSON.stringify(item))
 return acc
 }, {})
}
const mergedObj = mergeWithReference(obj1, obj2) 
obj1.id = 85
obj2.type.id = 22
console.log(mergedObj);