La méthode statiqueObject.groupBy() groupe les éléments d'un itérable donné selon la chaîne de caractères obtenue par la fonction de rappel fournie. L'objet renvoyé possède différentes propriétés pour chaque groupe, contenant des tableaux avec les éléments du groupe.

Cette méthode devrait être utilisée lorsque les noms des groupes peuvent être représentés par des chaînes de caractères. S'il vous faut grouper des éléments selon une clé qui peut être une valeur arbitraire, privilégiez la méthodeMap.groupBy().

Exemple interactif

const inventory = [  { name: "asparagus", type: "vegetables", quantity: 9 },  { name: "bananas", type: "fruit", quantity: 5 },  { name: "goat", type: "meat", quantity: 23 },  { name: "cherries", type: "fruit", quantity: 12 },  { name: "fish", type: "meat", quantity: 22 },];const restock = { restock: true };const sufficient = { restock: false };const result = Object.groupBy(inventory, ({ quantity }) =>  quantity < 6 ? "restock" : "sufficient",);console.log(result.restock);// [{ name: "bananas", type: "fruit", quantity: 5 }]

Syntaxe

Object.groupBy(items, fnRappel)

Paramètres

items

Unitérable (comme untableau (Array)) dont les éléments seront groupés.

fnRappel

Une fonction à exécuter pour chaque élément de l'itérable. Cette fonction devrait renvoyer une valeur qui peut être convertie en une clé de propriété (c'est-à-dire une chaîne de caractères ou unsymbole) indiquant le groupe de l'élément courant. Cette fonction est appelée avec les arguments suivants :

element

L'élément courant qui est traité.

index

L'indice de l'élément courant qui est traité.

Valeur de retour

Unobjet avec un prototypenull avec une propriété pour chaque groupe, qui contient un tableau des éléments du groupe correspondant.

Description

Object.groupBy() appelle une fonction de rappelfnRappel() sur chaque élément de l'itérable. Cette fonction renvoie alors une chaîne de caractères ou un symbole (sinon la valeur estconvertie en chaîne de caractères) qui indique le groupe de l'élément. Les valeurs renvoyées parfnRappel() sont utilisées comme clés pour l'objet renvoyé parObject.groupBy(). La valeur de chaque propriété est un tableau dont les éléments sont ceux pour lesquels la fonction de rappel a renvoyé la même valeur.

Les éléments de l'objet renvoyé et de l'itérable original sont les mêmes (il ne s'agit pas decopies profondes). Modifier la structure interne des éléments sera reflété à la fois sur l'itérable original et sur l'objet renvoyé.

Exemples

UtiliserObject.groupBy()

Pour commencer, on définit un tableau contenant un inventaire d'aliments. Chaque aliment possède un nom, un type et une quantité.

const inventaire = [  { nom: "asperges", type: "légumes", quantite: 5 },  { nom: "bananes", type: "fruit", quantite: 0 },  { nom: "agneau", type: "viande", quantite: 23 },  { nom: "cerises", type: "fruit", quantite: 5 },  { nom: "poisson", type: "viande", quantite: 22 },];

L'instruction suivante groupera les éléments selon leur propriététype.

const resultat = Object.groupBy(inventaire, ({ type }) => type);/* Le résultat sera :{  légumes: [    { nom: 'asperges', type: 'légumes', quantite: 5 },  ],  fruit: [    { nom: "bananes", type: "fruit", quantite: 0 },    { nom: "cerises", type: "fruit", quantite: 5 }  ],  viande: [    { nom: "agneau", type: "viande", quantite: 23 },    { nom: "poisson", type: "viande", quantite: 22 }  ]}*/

La fonction fléchée renvoie la valeur detype pour chaque élément du tableau. On notera que l'argument{ type } est un exemplede la syntaxe de décomposition d'objet pour les arguments de fonction. Cela extrait la propriététype d'un objet passé en paramètre et affecte la valeur à une variable nomméetype dans le corps de la fonction. On peut ainsi écrire succinctement l'accès aux propriétés d'un élément dans une fonction.

On pourrait également créer des groupes selon les valeurs d'une ou plusieurs propriétés de l'élément. Dans l'exemple qui suit, on place les aliments dans deux groupesok ourestock selon la valeur de leur propriétéquantite.

function maFonctionDeRappel({ quantite }) {  return quantite > 5 ? "ok" : "restock";}const resultat2 = Object.groupBy(inventaire, maFonctionDeRappel);/* Le résultat sera :{  restock: [    { nom: "asperges", type: "légumes", quantite: 5 },    { nom: "bananes", type: "fruit", quantite: 0 },    { nom: "cerises", type: "fruit", quantite: 5 }  ],  ok: [    { nom: "agneau", type: "viande", quantite: 23 },    { nom: "poisson", type: "viande", quantite: 22 }  ]}*/

Spécifications

Compatibilité des navigateurs

Voir aussi

• Une prothèse d'émulation (polyfill) deObject.groupBy() dans la bibliothèque tiercecore-js
• Le guide sur les collections indexées
• Array.prototype.reduce()
• Object.fromEntries()
• Map.groupBy()