Maison  >  Article  >  interface Web  >  Comment fusionner des objets JavaScript dans un tableau avec des clés partagées ?

Comment fusionner des objets JavaScript dans un tableau avec des clés partagées ?

Mary-Kate Olsen
Mary-Kate Olsenoriginal
2024-10-30 23:43:30872parcourir

How to Merge JavaScript Objects in an Array with Shared Keys?

Fusionner des objets JavaScript dans un tableau avec des clés partagées

En JavaScript, il est souvent nécessaire de combiner des objets avec des clés similaires en un seul objet . Considérons l'exemple donné :

<code class="js">const array = [
  {
    name: "foo1",
    value: "val1"
  },
  {
    name: "foo1",
    value: ["val2", "val3"]
  },
  {
    name: "foo2",
    value: "val4"
  }
];</code>

Le but est de réorganiser ce tableau en un tableau "de sortie" où toutes les clés de valeur sont fusionnées en objets avec des noms partagés. Le résultat attendu ressemblerait à :

<code class="js">const output = [
  {
    name: "foo1",
    value: ["val1", "val2", "val3"]
  },
  {
    name: "foo2",
    value: ["val4"]
  }
];</code>

Fusionner les objets

Une approche de ce problème consiste à utiliser les étapes suivantes :

  1. Parcourez chaque objet du tableau à l'aide de forEach().
  2. Filtrez le tableau de sortie pour trouver un objet existant avec la même clé de nom.
  3. Si un objet existant est trouvé, concaténez le valeurs de l'objet actuel à son tableau de valeurs.
  4. Si un objet existant n'est pas trouvé, créez un nouvel objet avec les propriétés de l'objet actuel et ajoutez-le au tableau de sortie.
  5. Gérez la possibilité de la valeur étant une chaîne en la convertissant en tableau.

Exemple de code

Le code suivant implémente l'approche décrite :

<code class="js">const array = [
  {
    name: "foo1",
    value: "val1"
  },
  {
    name: "foo1",
    value: ["val2", "val3"]
  },
  {
    name: "foo2",
    value: "val4"
  }
];

let output = [];

array.forEach(item => {
  const existing = output.filter(v => v.name == item.name);
  if (existing.length) {
    const existingIndex = output.indexOf(existing[0]);
    output[existingIndex].value = output[existingIndex].value.concat(item.value);
  } else {
    if (typeof item.value == 'string') item.value = [item.value];
    output.push(item);
  }
});

console.log(output);</code>

Ce code produira le tableau de sortie souhaité dans lequel tous les objets portant le même nom verront leurs valeurs fusionnées.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn