Tableaux d'objets en TypeScript

Les tableaux en TypeScript peuvent contenir non seulement des primitives, mais aussi des objets de types spécifiques. Regardons avec des exemples comment travailler avec de tels tableaux.

Tableau d'utilisateurs

Supposons que nous ayons une interface définissant un utilisateur :

typescriptinterface User {
  name: string,
  age: number
}

Déclarons un tableau en spécifiant comme type de son contenu des objets utilisateurs (c'est-à-dire des objets implémentant notre interface) :

typescriptlet arr: User[] = [];

Remplissons notre tableau avec des données du type spécifié :

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

Tableau de dates

Déclarons un tableau stockant un tableau de dates :

typescriptlet arr: Date[] = [];

Remplissons ce tableau avec des dates :

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

Tableau d'éléments DOM

Déclarons un tableau contenant des éléments DOM :

typescriptlet arr: HTMLElement[] = [];

Remplissons notre tableau avec des données :

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

Tâches pratiques