Objektitaulukot TypeScriptissä

TypeScriptin taulukot voivat sisältää itsessään paitsi primitiivejä, myös tiettyjen tyyppien objekteja. Katsotaan esimerkkejä, kuinka työskennellä tällaisten taulukoiden kanssa.

Käyttäjätaulukko

Oletetaan, että meillä on käyttäjän määrittelevä rajapinta:

typescriptinterface User {
  name: string,
  age: number
}

Esitellään taulukko määrittämällä sen sisällön tyypiksi käyttäjäobjektit (eli rajapintamme toteuttavat objektit):

typescriptlet arr: User[] = [];

Täytetään taulukkomme määritellyn tyyppisillä datalla:

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

Päivämäärätaulukko

Esitellään taulukko, joka sisältää itsessään päivämäärätaulukon:

typescriptlet arr: Date[] = [];

Täytetään tämä taulukko päivämäärillä:

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

DOM-elementtitaulukko

Esitellään taulukko, joka sisältää itsessään DOM-elementtejä:

typescriptlet arr: HTMLElement[] = [];

Täytetään taulukkomme datalla:

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

Käytännön tehtävät