Merge two JSON objects containing arrays using jQuery

Question

I'm trying to merge two JSON objects which contains arrays:

var data1 = '{"resourceType": "test", "entry": [{"foo": 123, "test":"foo"},{"foo": 456, "test":"abc"}]}';
var data2 = '{"resourceType": "test", "entry": [{"foo": 789, "test":"bar"},{"foo": 102, "test":"def"}]}';

var json1 = JSON.parse(data1);
var json2 = JSON.parse(data2);

var obj = $.extend({},json1,json2);
console.log(obj);

but what I'm getting is overwritten by data2 object when .concat will create an array with those two objects rather than wham I'm looking for is to get entry array of objects to be combined.

JSFiddle

Desired results should be like:

{"resourceType": "test", 
 "entry": [
    {"foo": 123, "test":"foo"},
    {"foo": 456, "test":"abc"},
    {"foo": 789, "test":"bar"},
    {"foo": 102, "test":"def"}
  ]
}

Any tips on that?

@TA Yeah, I have tried that: `var obj = $.merge( $.merge( [], json1 ), json2 )` — JackTheKnife, Jul 09 '18 at 15:06
Merge them manually. In this case you only have two objects, either with identical keys and one value that differs, just create a new object and merge the arrays. — Kevin B, Jul 09 '18 at 15:21
@KevinB is this only the way to go in my case? If so post it as an answer. Thanks! — JackTheKnife, Jul 09 '18 at 15:23
@KevinB LOL _Yeah, I probably downvoted your post._ Now I know who did it :P — JackTheKnife, Jul 09 '18 at 15:26
I mean... that only accounts for one of the two downvotes, ;) — Kevin B, Jul 09 '18 at 15:27
Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/174664/discussion-between-jacktheknife-and-kevin-b). — JackTheKnife, Jul 09 '18 at 15:29

EECOLOR · Accepted Answer · 2018-07-09T15:35:54.340

1

If you look at the documentation of jquery extend you can see that you can pass deep as first argument:

var obj = $.extend(true, {},json1,json2);

With your test data, because the keys in the objects are named the same, the result will just have the second set of objects.

If you want some other result you need to update your question to clarify the desired effect.

Update

If you want the entries to be combined you can do something like this:

var entries = json1.entry.concat(json2.entry);
console.log(entries);

edited Jul 09 '18 at 15:35

answered Jul 09 '18 at 15:06

EECOLOR

11,184
3
41
75

I agree. `deep` will make the difference. – Jul 09 '18 at 15:08
1

@DiabolicWords Except... it won't. It doesn't combine values. It won't combine the two arrays into one, it'll simply throw one of them away. – Kevin B Jul 09 '18 at 15:09
@KevinB is correct - result is the same as w/o `deep` – JackTheKnife Jul 09 '18 at 15:11
And what about this: https://stackoverflow.com/questions/18498801/how-to-merge-two-object-values-by-keys – Jul 09 '18 at 15:13

score 0 · Answer 2 · answered Jul 09 '18 at 15:53

0

Merge two objects x and y deeply, returning a new merged object with the elements from both x and y.

https://www.npmjs.com/package/deepmerge

http://jsfiddle.net/d38L6uhs

answered Jul 09 '18 at 15:53

Arun

41
1
8

Interesting option – JackTheKnife Jul 09 '18 at 17:41

Merge two JSON objects containing arrays using jQuery

2 Answers2