Json object merge with unqiue id

I have multiple json Objects

json1 = [
    {'category_id':1,'name':'test1' },
    {'category_id':1,'name':'test2' },
    {'category_id':1,'name':'test3' },
    {'category_id':2,'name':'test2' },
    {'category_id':3,'name':'test1' }
];

json2 = [{'category_id':1,'type':'test1'}];

json3 = [
    {'category_id':1,'color':'black'},
    {'category_id':2,'color':'black'},
    {'category_id':3,'color':'white'}
];

I am expecting output like this

final = [
    {'category_id':1,'name':'test1','type':'test`','color':'black' },
    {'category_id':1,'name':'test2','type':'test`','color':'black' },
    {'category_id':1,'name':'test3','type':'test`','color':'black' },
    {'category_id':2,'name':'test2','color':'black' },
    {'category_id':3,'name':'test1','color':'white' }
];

As i have long json object. Looping is good idea or not ? Does there is any inbuilt function for doing the same.

Using underscore you can achieve it via:

Demo Fiddle

var jsons = [json1, json2, json3];

var final = {};

// merge all data
_.each(jsons, function (jsonArr) {
    _.each(jsonArr, function (json) {
        final[json.category_id] = _.extend({}, final[json.category_id], json);
    });
});

// map it back onto json1    
var finalArr = _.map(json1, function (json) {
    return final[json.category_id];
});
console.log(finalArr);

Final value of finalArr:

enter image description here

Here is how you can do the same in plain javascript. :)

var final = {};

var jsons = [json1, json2, json3];

for(var i=0;i<jsons.length;i++){
    final[i]=jsons[i];
}

Fiddle

EDIT:

Well, you will have to do it programmatically!