Dynamically merge different arrays in javascript


I want to combine two arrays (ranking and matches) that has common properties:

var ranking = [{     def: "0.58",     league: "Scottish Premiership",     name: "Celtic",     off: "3.33",     grank: "3",     tform: "96.33", }, {     def: "2.52",     league: "Scottish Premiership",     name: "Dundee",     off: "1.28",     grank: "302",     tform: "27.51", }]  var matches = [{ date: "2010-04-22", league: "Scottish Premiership", home: "0.0676", away: "0.8", draw: "0.1324", goals1: "3", goals2: "1", tform1: "96.33", tform2: "27.51", team1: "Celtic", team2: "Dundee",}] 

Expected output looks like this:

[{ date: "2010-04-22", league: "Scottish Premiership", home: "0.0676", away: "0.8", draw: "0.1324", goals1: "3", goals2: "1", tform1: "96.33", tform2: "27.51", def1: "0.58", def2: "2.52", off1: "3.33", off2: "1.28", grank1: "3", grank2: "302", team1: "Celtic", team2: "Dundee",}] 

To merge the arrays, I used Lodash _.merge function

var result = _.merge(ranking, matches); 

The output it returned did merge some objects and omitted homogeneous objects.

Please I need some help and insight in achieving this task. I wouldn’t mind any javascript (client-side) solution.