Comment fusionner des clés en double et additionner leurs valeurs dans un tableau d'objets JavaScript ?

Fusionner des clés en double et additionner des valeurs dans un tableau d'objets

En JavaScript, travailler avec des tableaux d'objets peut être courant. Parfois, nous pouvons rencontrer le besoin de regrouper et de modifier des objets au sein d’un tableau tout en conservant des propriétés spécifiques. Un de ces scénarios consiste à résumer les valeurs associées à des clés similaires.

Explorons cette tâche avec un exemple de tableau d'objets :

const objects = [
  { name: 'P1', value: 150 },
  { name: 'P1', value: 150 },
  { name: 'P2', value: 200 },
  { name: 'P3', value: 450 },
];

Notre objectif est de regrouper les objets par la propriété 'name' et additionnez la propriété « valeur » pour chaque « nom » distinct. Le résultat souhaité devrait ressembler à ceci :

[
  { name: 'P1', value: 300 },
  { name: 'P2', value: 200 },
  { name: 'P3', value: 450 },
];

Pour y parvenir, nous pouvons utiliser les capacités de manipulation d'objets et de tableaux de JavaScript. Voici une solution étape par étape :

1. Créez un objet pour stocker les valeurs additionnées

Commencez par créer un objet JavaScript vide appelé « titulaire » qui servira de conteneur pour stocker les valeurs additionnées pour chaque « nom ».

2. Parcourez le tableau d'entrée

Utilisez une boucle « forEach » pour parcourir chaque objet du tableau d'entrée (« objets »).

3. Vérifiez les noms existants dans 'holder'

Dans la boucle, vérifiez si la propriété 'name' de l'objet actuel existe déjà en tant que propriété dans l'objet 'holder' en utilisant 'hasOwnProperty(d.name)'.

4. Somme ou initialiser les valeurs

Si la propriété 'name' existe, ajoutez la propriété 'value' de l'objet actuel à la propriété correspondante dans 'holder' (par exemple, 'holder[d.name] = d.value '). Si la propriété 'name' n'est pas trouvée, initialisez-la avec la propriété 'value' de l'objet actuel ('holder[d.name] = d.value').

5. Créez un nouveau tableau avec des objets fusionnés

Une fois toutes les valeurs additionnées, créez un nouveau tableau vide appelé « obj2 » pour stocker les objets fusionnés.

6. Itérer sur 'holder' et pousser les objets fusionnés

Utilisez une autre boucle pour parcourir les propriétés de l'objet 'holder' (« for (var prop inholder) »). Pour chaque propriété, créez un nouvel objet avec les propriétés « nom » et « valeur » et poussez-le dans « obj2 ».

7. Enregistrez la sortie

Enfin, enregistrez le tableau 'obj2' sur la console pour afficher les objets fusionnés avec les propriétés 'valeur' ​​additionnées.

Exemple de code

Voici un extrait de code qui démontre la solution :

const objects = [
  { name: 'P1', value: 150 },
  { name: 'P1', value: 150 },
  { name: 'P2', value: 200 },
  { name: 'P3', value: 450 },
];

const holder = {};

objects.forEach(d => {
  if (holder.hasOwnProperty(d.name)) {
    holder[d.name] += d.value;
  } else {
    holder[d.name] = d.value;
  }
});

const obj2 = [];

for (var prop in holder) {
  obj2.push({ name: prop, value: holder[prop] });
}

console.log(obj2);

En suivant ces étapes, vous pouvez efficacement regrouper et additionner les valeurs associées avec des clés similaires dans un tableau d'objets, créant un nouveau tableau avec des objets modifiés selon le résultat souhaité.

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!