In der JavaScript-Programmierung gibt es häufig Situationen, in denen wir Arrays mit Objekten sortieren müssen. Dies kann bei der Arbeit mit komplexen Datenstrukturen wie Listen von Benutzern, Produkten oder Bewertungen sehr hilfreich sein. Das Sortieren von Arrays mit Objekten kann jedoch etwas komplexer sein als das Sortieren von einfachen Arrays von Zahlen oder Strings. In diesem Blogartikel werden wir uns verschiedene Möglichkeiten anschauen, wie wir Arrays mit Objekten in JavaScript sortieren können.
Array von Objekten erstellen
Wir beginnen mit der Erstellung eines Arrays von Objekten, die wir später sortieren können. Nehmen wir an, wir haben eine Liste von Personen mit den Eigenschaften Name, Alter und Beruf. Wir können diese Liste als Array von Objekten erstellen:
“’javascript
const personen = [
{ name: ‚Max‘, alter: 30, beruf: ‚Softwareentwickler‘},
{ name: ‚Anna‘, alter: 25, beruf: ‚Designer‘},
{ name: ‚Tom‘, alter: 35, beruf: ‚Verkäufer‘}
];
“‘
Jetzt haben wir ein Array namens „personen“, das drei Objekte enthält. Jedes Objekt repräsentiert eine Person mit ihren entsprechenden Eigenschaften.
Vergleichen von Objekt-Eigenschaften
Bevor wir uns mit verschiedenen Sortiermethoden befassen, müssen wir verstehen, wie das Sortieren von Objekten funktioniert. JavaScript verwendet einen Vergleichsoperator (normalerweise den „<
„-Operator), um Strings und Zahlen zu vergleichen. Wenn wir jedoch eine Sortierung nach Eigenschaften eines Objekts vornehmen möchten, müssen wir einen eigenen Vergleichsmechanismus implementieren.
Um die Eigenschaften von Objekten zu vergleichen, können wir die Funktion sort()
verwenden, die in JavaScript Arrays verfügbar ist. Diese Funktion erwartet eine Vergleichsfunktion als Parameter, die zwei Werte empfängt und einen negativen Wert zurückgibt, wenn der erste Wert „kleiner“ ist als der zweite, einen positiven Wert zurückgibt, wenn der erste Wert „größer“ ist als der zweite, und null zurückgibt, wenn die Werte „gleich“ sind.
“’javascript
const personenSortiert = personen.sort((personA, personB) => {
if (personA.alter < personB.alter) {
return -1;
} else if (personA.alter > personB.alter) {
return 1;
} else {
return 0;
}
});
console.log(personenSortiert);
“‘
Das oben gezeigte Beispiel verwendet die Eigenschaft „alter“ der Personenobjekte, um das Array von Personen nach Alter zu sortieren. Wir verwenden die sort()
-Funktion, um das Array zu sortieren, und übergeben anonyme Funktion, die als Vergleichsmechanismus dient. Die Funktion vergleicht die „alter“-Eigenschaft von zwei Personenobjekten und gibt entsprechend einen negativen Wert, einen positiven Wert oder null zurück.
Sortiermethoden
Es gibt verschiedene Möglichkeiten, Arrays mit Objekten in JavaScript zu sortieren. Wir werden uns nun einige der gebräuchlichsten Sortiermethoden anschauen.
Sortieren nach einer Eigenschaft
Die einfachste Methode zum Sortieren von Arrays mit Objekten besteht darin, die sort()
-Funktion zu verwenden und einen Vergleichsmechanismus zu implementieren, der eine bestimmte Eigenschaft der Objekte verwendet.
“’javascript
const personenNachName = personen.sort((personA, personB) => {
if (personA.name < personB.name) {
return -1;
} else if (personA.name > personB.name) {
return 1;
} else {
return 0;
}
});
console.log(personenNachName);
“‘
In diesem Beispiel sortieren wir das Array von Personenobjekten nach dem Namen, indem wir die Eigenschaft „name“ in der Vergleichsfunktion verwenden.
Sortieren nach mehreren Eigenschaften
In einigen Fällen möchten wir möglicherweise nach mehr als einer Eigenschaft sortieren. Wir können dies erreichen, indem wir die Vergleichslogik entsprechend anpassen. Wenn die ersten beiden Eigenschaften gleich sind, vergleichen wir eine weitere Eigenschaft und so weiter.
“’javascript
const personenNachAlterUndBeruf = personen.sort((personA, personB) => {
if (personA.alter < personB.alter) {
return -1;
} else if (personA.alter > personB.alter) {
return 1;
} else {
if (personA.beruf < personB.beruf) {
return -1;
} else if (personA.beruf > personB.beruf) {
return 1;
} else {
return 0;
}
}
});
console.log(personenNachAlterUndBeruf);
“‘
Das obige Beispiel sortiert das Array von Personenobjekten zuerst nach dem Alter und dann nach dem Beruf. Wenn das Alter einer Person gleich ist, vergleichen wir die Berufe der Personen.
Sortieren mit lokalem Vergleichsmechanismus
Manchmal möchten wir das Array anhand einer bestimmten Eigenschaft sortieren, aber auf eine andere Art und Weise als die standardmäßige Reihenfolge. In solchen Fällen können wir einen lokalen Vergleichsmechanismus verwenden, der die Standardeinstellungen überschreibt.
“’javascript
const personenNachNameCaseInsensitive = personen.sort((personA, personB) => {
return personA.name.toLowerCase().localeCompare(personB.name.toLowerCase());
});
console.log(personenNachNameCaseInsensitive);
“‘
In diesem Beispiel sortieren wir das Array von Personenobjekten nach dem Namen, unabhängig von der Groß- und Kleinschreibung. Wir verwenden die localeCompare()
-Funktion, um eine Fall-unabhängige Vergleichslogik zu implementieren.
Lerne Arrays in JavaScript zu sortieren
Fazit
In diesem Artikel haben wir uns angeschaut, wie wir Arrays mit Objekten in JavaScript sortieren können. Wir haben gelernt, wie wir einen Vergleichsmechanismus implementieren können, um die Eigenschaften von Objekten zu vergleichen. Wir haben verschiedene Sortiermethoden wie Sortieren nach einer Eigenschaft, Sortieren nach mehreren Eigenschaften und Sortieren mit lokalem Vergleichsmechanismus kennengelernt.
Das Sortieren von Arrays mit Objekten ist eine wichtige Technik in der JavaScript-Programmierung und kann bei der Verarbeitung von komplexen Datenstrukturen sehr hilfreich sein. Mit den in diesem Artikel dargestellten Techniken sollte es Ihnen möglich sein, Arrays mit Objekten in JavaScript effektiv zu sortieren.
Wir hoffen, dass Ihnen dieser Artikel geholfen hat und Ihnen dabei hilft, Arrays mit Objekten in JavaScript erfolgreich zu sortieren.