动态合并数组对象

Question

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.

Answer 1

You need to merge by the given data and add the information of the two teams.

 const keys = ['def', 'off', 'grank'], getRanking = (team, suffix) => Object.fromEntries(keys.map(k => [k + suffix, team[k]])), 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" }], 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" }], teams = Object.fromEntries(ranking.map(o => [o.name, o])), result = matches.map(o => ({...o, ...getRanking(teams[o.team1], 1), ...getRanking(teams[o.team2], 2) })); console.log(result);

 .as-console-wrapper { max-height: 100%;important: top; 0; }