Gruppe ein Array von Objekten in JavaScript

Manchmal müssen die Entwickler eine Reihe von Objekten nach einem bestimmten Schlüssel oder Eigenschaftswert organisieren. JavaScript bietet einige vordefinierte Methoden und Bibliotheken, einschließlich der “reduzieren()”Methode oder die“gruppiere nach()Methode aus der Lodash -Bibliothek.

In diesem Tutorial wird Methoden zum Gruppieren von JavaScript -Objekten in einem Array demonstriert.

So gruppieren Sie eine Reihe von Objekten in JavaScript?

Verwenden Sie die folgenden Methoden, um eine Reihe von Objekten in JavaScript zu gruppieren:

• Reduzierung () Methode
• GroupBy () Methode aus der Lodash -Bibliothek

Lassen Sie uns die Arbeit dieser Methoden nacheinander verstehen.

Methode 1: Gruppieren Sie ein Array von Objekten mit record () Methode

Die am häufigsten verwendete Methode zur Gruppierung des Objektarrays ist die “reduzieren()" Methode. Es wird mit der Call-Back-Funktion aufgerufen. Es reduziert das Array von Objekten, die nach angegebenem Typ gruppiert werden. Die Methode record () ist leistungsfähig, aber etwas komplex zu verstehen.

Syntax

Verwenden Sie die folgende Syntax für die Methode recry (), um ein Array von Objekten zu gruppieren:

Reduzieren (vorheriger Wert, Stromwert)

Rückgabewert

Es gibt die Summe aller gruppierten Elemente in einem Array zurück.

Beispiel

Erstellen Sie eine Reihe von Objekten “Array”Mit Eigenschaften, Namen und Kategorien:

const array = [
Name: "Apple", Kategorie: "Früchte",
Name: "Orange", Kategorie: "Farben",
Name: "Mango", Kategorie: "Früchte",
Name: "Peach", Kategorie: "Farben",
Name: "Orange", Kategorie: "Früchte",
Name: "Grapes", Kategorie: "Früchte",
];

Ruf den "reduzieren()"Methode mit der Rückruf -Pfeilfunktion, mit der die Objekte basierend auf dem Schlüssel" Kategorie "gruppiert und in einer Variablen speichern können"GroupArrayObject”:

const GroupArrayObject = Array.reduzieren ((Gruppe, arr) =>
const Kategorie = arr;
Gruppe [Kategorie] = Gruppe [Kategorie] ?? [];
Gruppe [Kategorie].Push (arr);
Rückkehrgruppe;
,
);

Drucken Sie das resultierende Array auf der Konsole mit der “druckenKonsole.Protokoll()" Methode:

Konsole.log (GroupArrayObject);

Ausgang

Aus der obigen Ausgabe hat das resultierende Array zwei minimierte Arrays “Farben" Und "Früchte”. Klicken Sie einfach auf den Array -Kopf neben dem Namen des minimierten Arrays, um ihn zu erweitern:

Jetzt zeigt die Ausgabe zwei Objekte “,“Farben" Und "Früchte,Das enthalten 2 bzw. 4 Arrays.

Methode 2: Gruppieren Sie ein Array von Objekten unter Verwendung von GroupBy () -Methode

Eine andere Methode zur Gruppierung eines Arrays von Objekten ist die “ist die“gruppiere nach()" Methode. Die GroupBy () -Methode wird im NPM -Projekt mit der “verwendetLodash" Bibliothek. Es ist einfacher zu verstehen und nimmt weniger Codezeilen ein.

Syntax

Befolgen Sie die unten erwähnte Syntax für die Gruppe GroupBy (), um das Array von Objekten in JavaScript zu gruppieren:

_.GroupBy (Liste, Schlüssel)

In der obigen Syntax,

• Der "ListeIst eine Reihe von Objekten.
• Der "TasteIst Eigentum der Objekte, nach denen die Elemente gruppiert werden.

Rückgabewert

Es gibt die mehreren Sammlungen zurück, die nach einem bestimmten Schlüssel gruppiert sind.

Beispiel

Verwenden Sie die folgenden Befehle, um die Lodash -Bibliothek in Ihr NPM -Projekt aufzunehmen:

$ npm i -g npm
$ npm i -Save Lodash

Fügen Sie dann die Lodash -Bibliothek in die JavaScript -Datei mit der folgenden Zeile hinzu:

var _ = require ("lodash");

Verwenden Sie danach einfach die folgenden Codezeilen:

const array = [
Name: "Apple", Kategorie: "Früchte",
Name: "Orange", Kategorie: "Farben",
Name: "Mango", Kategorie: "Früchte",
Name: "Peach", Kategorie: "Farben",
Name: "Orange", Kategorie: "Früchte",
Name: "Grapes", Kategorie: "Früchte",
];
lass output = _.GroupBy (Array, "Kategorie");
Konsole.Protokoll (Ausgabe);

In diesem Code -Snippet:

• Erstellen Sie ein Array von Objekten, die als "Array" bezeichnet werden.
• Ruf den "gruppiere nach()Methode durch Übergabe eines Arrays von Objekten "Array"Und ein Schlüssel"KategorieIn It, welche alle Elemente in Bezug auf die Kategorien gruppieren.

Führen Sie den oben genannten Code aus, und die Ausgabe ist:

Es kann leicht beobachtet werden.

Abschluss

Für die Gruppierung verwenden eine Reihe von Objekten in JavaScript die “die“reduzieren()”Methode oder die“gruppiere nach()" Methode. Die Methode record () ist die am häufigsten verwendete Methode zum Gruppieren eines Arrays von Objekten, während die Gruppe GroupBy () weniger Code benötigt und leichter zu verstehen ist. Sie wird jedoch im NPM -Projekt mit der Lodash -Bibliothek ausgeführt. Dieses Tutorial hat die Methoden gezeigt, um JavaScript -Objekte in einem Array zu gruppieren.