Comment puis-je regrouper efficacement un tableau d'objets en JavaScript à l'aide d'une approche Vanilla ?

Méthode GroupBy efficace pour les tableaux d'objets

Le regroupement d'objets en fonction de propriétés communes est une tâche courante dans le traitement des données. Cet extrait fournit une solution efficace pour regrouper des objets dans un tableau à l'aide d'une approche JavaScript vanille.

Pourquoi éviter Underscore.js ?

Bien que Underscore.js propose une fonction groupBy, son implémentation peut ne pas être convient si vous avez besoin de résultats « fusionnés » plutôt que de groupes séparés.

Custom Vanilla JS GroupBy

Le script suivant définit une fonction groupBy qui opère sur un tableau d'objets :

var groupBy = function(xs, key) {
  return xs.reduce(function(rv, x) {
    (rv[x[key]] = rv[x[key]] || []).push(x);
    return rv;
  }, {});
};

Exemple d'utilisation

Pour regrouper des objets par « Phase » :

const data = [
  { Phase: "Phase 1", Step: "Step 1", Task: "Task 1", Value: "5" },
  ...
];
const groupedByPhase = groupBy(data, 'Phase');

groupedByPhase contiendra :

{
  "Phase 1": [
    { Phase: "Phase 1", Step: "Step 1", Task: "Task 1", Value: "5" },
    ...
  ],
  "Phase 2": [
    { Phase: "Phase 2", Step: "Step 1", Task: "Task 1", Value: "25" },
    ...
  ]
}

Pour regrouper davantage par "Step":

const groupedByPhaseStep = _(groupedByPhase).values().map(phase => {
  return groupBy(phase, 'Step');
}).value();

groupedByPhaseStep contiendra :

[
  {
    "Phase": "Phase 1",
    "Step": "Step 1",
    "Value": 15
  },
  ...
]

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!