【问题标题】:Consolidate array based on common property value基于公共属性值合并数组
【发布时间】:2019-06-11 20:39:48
【问题描述】:

我正在编写一个由 VueJS 和 ExpressionEngine 提供支持的小应用程序,用于显示高尔夫锦标赛排行榜。一场锦标赛可能要求您参加多个课程。来自数据库的数据如下所示(轮次)。

问题是我需要重组 rounds 数组,使它看起来像排行榜数组。我有一些作家阻止如何做到这一点。任何指导将不胜感激!

rounds: [
   {
      team: "Dropkick Murphies",
      score: 75,
      course: 17
   },
   {
      team: "Dropkick Murphies",
      score: 62,
      course: 24
   },
   {
      team: "Dropkick Murphies",
      score: 69,
      course: 26
   },
   {
      team: "Gigantic",
      score: 67,
      course: 26
   },
   {
      team: "Gigantic",
      score: 65,
      course: 17
   },
   {
      team: "Gigantic",
      score: 63,
      course: 24
   }
]
leaderboard: [
   {
      team: 'Dropkick Murphys',
      rounds: [
         {
            score: 75,
            course: 17
         },
         {
            score: 62,
            course: 24
         },
         {
            score: 69,
            course: 26
         },
   },
   {
      team: 'Wooden Jellyfishes',
      rounds: [
         {
            score: 68,
            course: 24
         },
         {
            score: 65,
            course: 17
         },
         {
            score: 70,
            course: 26
         }
   },
]

【问题讨论】:

  • 嘿@Luke,强烈建议将尝试的代码显示为您想要处理的内容。 Stackoverflow 不是请求和接收站点,我们协助编写代码。请修改上面的问题,使其不那么含糊。

标签: javascript arrays object vue.js vuejs2


【解决方案1】:

一种方法是使用reduce()。在每次迭代中,您可以检查当前分析的对象是否已经存在于累积数组中(即具有相同 team name 的对象已经存在)。然后你可以使用这个条件将一个新的整个对象推送到累积数组中,或者只是将一组新数据添加到rounds 数组中:

const rounds = [
   {team: "Dropkick Murphies", score: 75, course: 17},
   {team: "Dropkick Murphies", score: 62, course: 24},
   {team: "Dropkick Murphies", score: 69, course: 26},
   {team: "Gigantic", score: 67, course: 26},
   {team: "Gigantic", score: 65, course: 17},
   {team: "Gigantic", score: 63, course: 24}
];

let res = rounds.reduce((r, {team, score, course}) =>
{
   let found = r.findIndex(x => x.team === team);
   
   if (found >= 0)
       r[found].rounds.push({score: score, course: course});
   else
       r.push({team: team, rounds: [{score: score, course: course}]});

   return r;

}, []);

console.log(res);

【讨论】:

    【解决方案2】:

    您可以为转换实现一个辅助函数。

    function convertRoundsToLeaderBoard(rounds) {
        var indexes = {};
        var leaderBoard = [];
        for (var round of rounds) {
            if (indexes[round.team] === undefined) {
                indexes[round.team] = leaderBoard.length;
                leaderBoard.push({
                    team: round.team,
                    rounds: [{score: round.score, course: round.course}]
                });
            } else {
                leaderBoard[indexes[round.team]].rounds.push({score: round.score, course: round.course});
            }
        }
        return leaderBoard;
    }
    

    让我们测试一下:

    convertRoundsToLeaderBoard(
    [
       {
          team: "Dropkick Murphies",
          score: 75,
          course: 17
       },
       {
          team: "Dropkick Murphies",
          score: 62,
          course: 24
       },
       {
          team: "Dropkick Murphies",
          score: 69,
          course: 26
       },
       {
          team: "Gigantic",
          score: 67,
          course: 26
       },
       {
          team: "Gigantic",
          score: 65,
          course: 17
       },
       {
          team: "Gigantic",
          score: 63,
          course: 24
       }
    ]);
    

    【讨论】:

      【解决方案3】:

      我建议使用Map 按团队键入您的数据。这样您就可以使用具有线性时间复杂度的forEach 循环构建数据:

      const rounds = [{team: "Dropkick Murphies",score: 75,course: 17},{team: "Dropkick Murphies",score: 62,course: 24},{team: "Dropkick Murphies",score: 69,course: 26},{team: "Gigantic",score: 67,course: 26},{team: "Gigantic",score: 65,course: 17},{team: "Gigantic",score: 63,course: 24}];
      
      // Create Map with one entry per team
      const map = new Map(rounds.map(({team}) => [team, []]));
      // Populate each team with their scores
      rounds.forEach(({team,score,course}) => map.get(team).push({score,course}));
      // Convert the Map to the desired data structure
      const result = Array.from(map, ([team, rounds]) => ({team, rounds}));
      
      console.log(result);

      【讨论】:

        【解决方案4】:

        可能不是最优雅的解决方案,但这是另一个:

        var data = {
            rounds: [{
                    team: "Dropkick Murphies",
                    score: 75,
                    course: 17
                },
                ...
            ]
        };
        
        var groups = {};
        for (var o of data.rounds) {
            if (!groups[o.team])
                groups[o.team] = [];
            groups[o.team].push({
                score: o.score,
                course: o.course
            });
        }
        var result = [];
        for (var g in groups) {
            result.push({
                team: g,
                rounds: groups[g]
            });
        }
        

        【讨论】:

          【解决方案5】:

          你可以使用reduce来做到这一点。

          这里我们使用 team name 作为关键属性并检查它是否已经在输出对象中,我们推送 scorecourse 如果不是我们创建一个新密钥,则在该特定团队密钥的 rounds 属性中。

          const rounds = [
             {team: "Dropkick Murphies", score: 75, course: 17},
             {team: "Dropkick Murphies", score: 62, course: 24},
             {team: "Dropkick Murphies", score: 69, course: 26},
             {team: "Gigantic", score: 67, course: 26},
             {team: "Gigantic", score: 65, course: 17},
             {team: "Gigantic", score: 63, course: 24}
          ];
          
          let op = rounds.reduce((output,current)=>{
            if(output[current.team]){
              output[current.team].rounds.push({
                score : current.score,
                course: current.score
              })} else {
                output[current.team] = {
                  team: current.team,
                  rounds: [{score:current.score, course:current.course}]
                }
              }
           return output 
          },{})
          
          console.log(Object.values(op))

          【讨论】:

            猜你喜欢
            • 1970-01-01
            • 2016-10-29
            • 2023-02-13
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            相关资源
            最近更新 更多