Array von Objekten in TypeScript sortieren

Sortieren Sie ein Array typisierter Objekte mit employeesList.sort((a, b) => a.empId - b.empId). Der Comparator gibt eine negative Zahl zurück, wenn a zuerst stehen soll, eine positive Zahl, wenn b zuerst stehen soll, und null, wenn die verglichenen Werte gleich sind. Für eine absteigende Sortierung kehren Sie die Subtraktion um; bei gleichen Werten des ersten Schlüssels können Sie eine weitere Eigenschaft vergleichen. sort() verändert das ursprüngliche Array. Wenn dessen Reihenfolge erhalten bleiben soll, erstellen Sie zunächst mit der Spread-Syntax ein neues Array.

Objekttyp für die Datensätze definieren

Ein Interface beschreibt, welche Eigenschaften jeder Datensatz enthalten muss. Hier hat jeder Mitarbeiter eine numerische empId und eine Zeichenkette als empDesignation. Mit einem gemeinsamen Typ kann TypeScript sowohl das Array als auch die Eigenschaftsnamen im Comparator prüfen. Das Interface ist ein Vertrag zur Compile-Zeit: Es hilft dabei, Tippfehler in Eigenschaftsnamen während der Bearbeitung zu erkennen, validiert aber keine Daten externer Quellen zur Laufzeit. Die Eigenschaftstypen sollten zu den Werten passen, die der Comparator vergleicht.

Ein TypeScript-Array mit Objekten erstellen

Deklarieren Sie das Array als Employee[], damit jedes Element dem Interface entsprechen muss. Definieren Sie in TypeScript interface Employee { empId: number; empDesignation: string } und deklarieren Sie const employeesList: Employee[] = [...]. Im Beispiel haben zwei Mitarbeiter dieselbe empId; ihre Berufsbezeichnungen bilden den zweiten Schlüssel des abschließenden Comparators. Die Eigenschaftsnamen in den Daten und in der Sortierfunktion müssen exakt übereinstimmen. Jedes Objektliteral wird gegen Employee geprüft. Fehlt eine erforderliche Eigenschaft oder hat ein Wert den falschen Typ, wird dies bei der Typprüfung gemeldet. Das ausführbare Beispiel weiter unten verwendet JavaScript-kompatible Objektliterale und kann daher direkt in Node.js ausgeführt werden; die TypeScript-Typannotationen gehören in eine .ts-Quelldatei.

Objekte nach einer oder mehreren Eigenschaften sortieren

Der numerische Comparator a.empId - b.empId sortiert die IDs aufsteigend und gibt bei gleichen Werten automatisch null zurück. Für eine absteigende Sortierung verwenden Sie b.empId - a.empId. Wenn Sie nach einer zweiten Eigenschaft sortieren möchten, geben Sie zunächst das Ergebnis des ID-Vergleichs zurück, sofern es nicht null ist. Bei gleichen IDs vergleichen Sie anschließend empDesignation. Bei Datensätzen, die in beiden Schlüsseln übereinstimmen, muss der Comparator null zurückgeben. Bei jedem Gleichstand -1 zurückzugeben, kann dem Sortieralgorithmus eine widersprüchliche Sortierregel vorgeben. Verwenden Sie für andere Zeichenfolgenfelder einen Zeichenfolgenvergleich statt einer Subtraktion. localeCompare() ist eine praktische Option, wenn die sprachabhängige Sortierung wichtig ist. Das Ergebnis kann von der Locale abhängen; legen Sie daher eine explizite Locale fest, wenn eine konsistente regionale Sortierung erforderlich ist. Falls eine Eigenschaft fehlen kann, legen Sie fest, an welcher Stelle solche Datensätze einsortiert werden sollen, und behandeln Sie diesen Fall, bevor Sie die Werte vergleichen.

Führen Sie dieses Beispiel aus:

const employeesList = [
  { empId: 20, empDesignation: "senior engineer" },
  { empId: 14, empDesignation: "junior engineer" },
  { empId: 14, empDesignation: "developer" },
  { empId: 25, empDesignation: "program manager" },
  { empId: 12, empDesignation: "director" },
];

const byIdAscending = [...employeesList].sort((a, b) => a.empId - b.empId);
const byIdDescending = [...employeesList].sort((a, b) => b.empId - a.empId);
const byIdThenDesignation = [...employeesList].sort((a, b) =>
  a.empId - b.empId || a.empDesignation.localeCompare(b.empDesignation)
);

console.log(byIdAscending.map((employee) => employee.empId).join(", "));
console.log(byIdDescending.map((employee) => employee.empId).join(", "));
console.log(byIdThenDesignation.map((employee) => `${employee.empId}: ${employee.empDesignation}`).join(" | "));

12, 14, 14, 20, 25
25, 20, 14, 14, 12
12: director | 14: developer | 14: junior engineer | 20: senior engineer | 25: program manager

Die Spread-Syntax sorgt dafür, dass jede Sortierung auf einer Kopie arbeitet und employeesList in der deklarierten Reihenfolge bleibt. Die ersten beiden Zeilen geben die IDs in entgegengesetzter Reihenfolge aus. Die letzte Zeile zeigt jede ID zusammen mit der jeweiligen Berufsbezeichnung; der Vergleich der Berufsbezeichnungen wird nur bei Mitarbeitern mit gleicher ID angewendet. Wählen Sie in einer echten Anwendung einen zweiten Schlüssel, durch den Datensätze mit gleichem ersten Schlüssel sinnvoll geordnet werden. Bei Bedarf können Sie nach demselben Muster weitere Vergleiche ergänzen.