Arrays von Objekten in TypeScript

Arrays in TypeScript können nicht nur Primitiva, sondern auch Objekte bestimmter Typen enthalten. Schauen wir uns an Beispielen an, wie man mit solchen Arrays arbeitet.

Array von Benutzern

Nehmen wir an, wir haben ein Interface, das einen Benutzer definiert:

typescriptinterface User {
  name: string,
  age: number
}

Deklarieren wir ein Array und geben als Typ seines Inhalts Objekte mit Benutzern an (d.h. Objekte, die unser Interface implementieren):

typescriptlet arr: User[] = [];

Füllen wir unser Array mit Daten des angegebenen Typs:

typescriptarr.push({name: 'john', age: 30});
arr.push({name: 'eric', age: 40});

Array von Datumsangaben

Deklarieren wir ein Array, das ein Array von Datumsangaben speichert:

typescriptlet arr: Date[] = [];

Füllen wir dieses Array mit Datumsangaben:

typescriptarr.push(new Date(2030, 11, 31));
arr.push(new Date(2020, 11, 31));

Array von DOM-Elementen

Deklarieren wir ein Array, das DOM-Elemente enthält:

typescriptlet arr: HTMLElement[] = [];

Füllen wir unser Array mit Daten:

typescriptlet lst: NodeList = document.querySelectorAll('div');
let arr: HTMLElement[] = Array.from(lst);

Praktische Aufgaben