Array von Objekten nach Eigenschaft in JavaScript sortieren

Aryan Tyagi 12 Oktober 2023
Array von Objekten nach Eigenschaft in JavaScript sortieren

In diesem Artikel wird erläutert, wie ein Array von Objekten basierend auf den Werten der Objekteigenschaften sortiert wird.

In JavaScript verwenden wir die Funktion sort(), um ein Array von Objekten zu sortieren. Mit der Funktion sort() werden die Elemente eines Arrays alphabetisch und nicht numerisch sortiert. Um die Elemente in umgekehrter Reihenfolge zu erhalten, können wir die Methode reverse() verwenden.

Die traditionelle Funktion sort() kann jedoch manchmal hinterherhinken, um ein Array von Objekten basierend auf einer Eigenschaft zu vergleichen. So können wir eine benutzerdefinierte Vergleichsfunktion erstellen, die mit der Funktion sort() verwendet wird. Diese Methode vergleicht die Eigenschaften der Elemente in einem Array.

Das folgende Beispiel zeigt, wie Sie Ihre eigene Vergleichsfunktion schreiben.

let students = [
  {fname: 'Rohan', lname: 'Dalal', age: 19},

  {fname: 'Zain', lname: 'Ahmed', age: 17},

  {fname: 'Anadi', lname: 'Malhotra', age: 19}
];


function compare_lname(a, b) {
  if (a.lname.toLowerCase() < b.lname.toLowerCase()) {
    return -1;
  }
  if (a.lname.toLowerCase() > b.lname.toLowerCase()) {
    return 1;
  }
  return 0;
}

students.sort(compare_lname);
console.log(students)

Ausgabe:

[
  { fname: 'Zain', lname: 'Ahmed', age: 17 },
  { fname: 'Rohan', lname: 'Dalal', age: 19 },
  { fname: 'Anadi', lname: 'Malhotra', age: 19 }
]

Im obigen Beispiel wandeln wir zuerst den lname in Kleinbuchstaben um und vergleichen dann die Namen je nach Stringvergleich. Es gibt das sortierte Array von Objekten basierend auf dem lname des Objekts zurück. Für absteigende Reihenfolge können wir die Funktion sort() durch reverse() ersetzen.

Wenn wir es mit Strings zu tun haben, können wir die Erstellung einer Vergleichsfunktion überflüssig machen und einfach die Funktion localeCompare() mit der Funktion sort() verwenden, um das gewünschte Ergebnis zu erhalten.

Siehe den Code unten.

let students = [
  {fname: 'Rohan', lname: 'Dalal', age: 19},

  {fname: 'Zain', lname: 'Ahmed', age: 21},

  {fname: 'Anadi', lname: 'Malhotra', age: 16}
];


students.sort((a, b) => a.lname.localeCompare(b.lname));
console.log(students);

Ausgabe:

[
  { fname: 'Zain', lname: 'Ahmed', age: 21 },
  { fname: 'Rohan', lname: 'Dalal', age: 19 },
  { fname: 'Anadi', lname: 'Malhotra', age: 16 }
]

localeCompare() funktioniert nur für Strings. Wir können dies nicht für Zahlen verwenden.

Um das sortierte Array basierend auf einer numerischen Eigenschaft zu erhalten, müssen wir in der Methode sort() eine Vergleichsfunktion bereitstellen, da die sort() methode normalerweise auch nicht mit Zahlen arbeitet.

Siehe den Code unten.

let students = [
  {fname: 'Rohan', lname: 'Dalal', age: 19},

  {fname: 'Zain', lname: 'Ahmed', age: 21},

  {fname: 'Anadi', lname: 'Malhotra', age: 16}
];

students.sort((a, b) => {
  return a.age - b.age;
});
console.log(students);

Das obige Beispiel vergleicht das Alter der Objekte und sortiert sie nach diesem Alter. Die Vergleichsfunktion ist nur einzeilig, wird also direkt mit der Methode sort() bereitgestellt. Um alles in absteigender Reihenfolge zu erhalten, verwenden Sie die Funktion reverse().

Alternativ können wir auch die Reihenfolge in der Vergleichsfunktion verschieben, um die endgültige Ausgabe in absteigender Reihenfolge zu erhalten.

Zum Beispiel,

let students = [
  {fname: 'Rohan', lname: 'Dalal', age: 19},

  {fname: 'Zain', lname: 'Ahmed', age: 21},

  {fname: 'Anadi', lname: 'Malhotra', age: 16}
];

students.sort((a, b) => {
  return b.age - a.age;
});
console.log(students);

Ausgabe:

[
  { fname: 'Zain', lname: 'Ahmed', age: 21 },
  { fname: 'Rohan', lname: 'Dalal', age: 19 },
  { fname: 'Anadi', lname: 'Malhotra', age: 16 }
]

Verwandter Artikel - JavaScript Array