JSFiddle - React, Tailwind, and code Playground

HTML

<pre id='o'></pre>

JavaScript

var obj1 = { data: [ 
                      {id:1, comment:"comment1"},
                      {id:2, comment:"comment2"},
                      {id:3, comment:"comment3"}
                   ] };

var obj2 = { data: [ 
                      {id:2, comment:"comment2"},
                      {id:3, comment:"comment3"},
                      {id:4, comment:"comment4"}
                   ] };

$.extend(obj1.data, obj2.data);

$('#o').append("Using $.extend()\n");
$('#o').append( JSON.stringify(obj1, undefined, 2) );

var obj1 = { data: [ 
                      {id:1, comment:"comment1"},
                      {id:2, comment:"comment2"},
                      {id:3, comment:"comment3"}
                   ] };

var obj2 = { data: [ 
                      {id:2, comment:"comment2"},
                      {id:3, comment:"comment3"},
                      {id:4, comment:"comment4"}
                   ] };

$.merge(obj1.data, obj2.data);

$('#o').append("\n\n\nUsing $.merge()\n");
$('#o').append( JSON.stringify(obj1, undefined, 2) );