Maison > interface Web > js tutoriel > Comment regrouper les éléments d'un tableau par propriétés d'objet en JavaScript ?

Comment regrouper les éléments d'un tableau par propriétés d'objet en JavaScript ?

DDD
Libérer: 2024-12-31 01:53:12
original
848 Les gens l'ont consulté

How to Group Array Items by Object Properties in JavaScript?

Regrouper les éléments du tableau par propriétés d'objet

Dans votre scénario, vous souhaitez consolider un tableau contenant des objets avec des propriétés de groupe communes dans un nouveau tableau . Chaque groupe doit avoir une gamme de couleurs unique.

Pour y parvenir en utilisant JavaScript :

  1. Créez un mappage des noms de groupe aux valeurs :
    Créez un objet vide, group_to_values. Ensuite, parcourez le tableau d'entrée, myArray, à l'aide de la méthode de réduction.
  • Pour chaque objet de myArray, vérifiez la propriété de groupe.
  • Stockez la propriété de groupe en tant que clé dans group_to_values.
  • Créez un tableau à cette clé s'il n'existe pas.
  • Appuyez sur le bouton propriété color de l'objet dans le tableau à la clé de groupe correspondante.
var group_to_values = myArray.reduce(function (obj, item) {
    obj[item.group] = obj[item.group] || [];
    obj[item.group].push(item.color);
    return obj;
}, {});
Copier après la connexion
  1. Transformer au format souhaité :
    Convertir l'objet group_to_values ​​dans le format souhaité format de tableau. Utilisez Object.keys() pour obtenir les noms des groupes et les transformer en objets.
var groups = Object.keys(group_to_values).map(function (key) {
    return {group: key, color: group_to_values[key]};
});
Copier après la connexion

Le résultat, les groupes, sera un tableau d'objets, chacun représentant un groupe, avec un tableau de couleurs contenant toutes les couleurs uniques pour ce groupe.

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!

source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal