Objekte-Array sortieren

Einführung

In diesem Lab werden wir untersuchen, wie man ein Array von Objekten basierend auf den angegebenen Eigenschaften und Reihenfolgen sortieren kann. Wir werden die Array.prototype.sort()-Methode und die Array.prototype.reduce()-Methode verwenden, um dies zu erreichen. Das Lab wird ein praktisches Verständnis davon vermitteln, wie man in JavaScript Arrays von Objekten manipulieren kann.

Wie man ein Array von Objekten in JavaScript sortiert

Um ein Array von Objekten in JavaScript zu sortieren, kannst du die Array.prototype.sort()-Methode und die Array.prototype.reduce()-Methode auf dem props-Array mit einem Standardwert von 0 verwenden.

Hier ist eine Beispiel-Funktion, orderBy, die ein Array von Objekten basierend auf den angegebenen Eigenschaften und Reihenfolgen sortiert:

const orderBy = (arr, props, orders = ["asc"]) =>
  [...arr].sort((a, b) =>
    props.reduce((acc, prop, i) => {
      if (acc === 0) {
        const [p1, p2] =
          orders[i] === "desc" ? [b[prop], a[prop]] : [a[prop], b[prop]];
        acc = p1 > p2 ? 1 : p1 < p2 ? -1 : 0;
      }
      return acc;
    }, 0)
  );

Um diese Funktion zu verwenden, übergib ein Array von Objekten, ein Array von Eigenschaften, nach denen sortiert werden soll, und ein optionales Array von Reihenfolgen. Wenn kein orders-Array übergeben wird, wird die Funktion standardmäßig nach 'asc' sortieren.

Hier sind einige Beispiele dafür, wie die orderBy-Funktion verwendet werden kann:

const users = [
  { name: "fred", age: 48 },
  { name: "barney", age: 36 },
  { name: "fred", age: 40 }
];

// sortiere nach Namen aufsteigend und Alter absteigend
orderBy(users, ["name", "age"], ["asc", "desc"]);
// Ausgabe: [{name: 'barney', age: 36}, {name: 'fred', age: 48}, {name: 'fred', age: 40}]

// sortiere nach Namen aufsteigend und Alter aufsteigend (Standardreihenfolge)
orderBy(users, ["name", "age"]);
// Ausgabe: [{name: 'barney', age: 36}, {name: 'fred', age: 40}, {name: 'fred', age: 48}]

Zusammenfassung

Herzlichen Glückwunsch! Du hast das Lab "Order Array of Objects" abgeschlossen. Du kannst in LabEx weitere Labs absolvieren, um deine Fähigkeiten zu verbessern.