Hoe wordt strikte typing van arrays en tuples in TypeScript geïmplementeerd en waarvoor wordt het gebruikt? Wat zijn de verschillen en valkuilen bij het gebruik?

Antwoord

In TypeScript kunnen arrays strikt getypeerd worden door het type van de elementen aan te geven met type[] of Array<type>. Bijvoorbeeld:

let arr: number[] = [1, 2, 3];

Tuples zijn arrays met een vaste lengte en types voor elk element:

let tuple: [string, number] = ["age", 30];

• Array: staat een onbeperkt aantal elementen van hetzelfde type toe.
• Tuple: fixeert de hoeveelheid en volgorde van types. Dit maakt het mogelijk om structuren te creëren zoals records of om waarden van verschillende types uit een functie terug te geven.

Valkuilen:

• Bij het gebruik van array-methoden (push, pop) op tuples is push niet verboden, maar het resultaat valt buiten de gegarandeerde typing.
• Onvoorzichtig uitbreiden van tuples leidt tot "onveilige" code.
• Destructurering van tuples in functies: verkeerd opgegeven type of lengte leidt tot fouten.

Vraag met een twist

Kunnen tuples in TypeScript een variabel aantal elementen bevatten, en hoe beïnvloedt dat de typing?

Antwoord: Ja, tuples kunnen restelementen bevatten met behulp van de syntaxis ..., maar vereisen nog steeds strikte typing van de overige elementen:

let tuple: [string, ...number[]] = ["id", 10, 20, 30];

Echter, de elementen voor ... moeten gespecificeerd zijn, en het type voor de resterende array moet uniform zijn.

Voorbeelden van echte fouten door onbekendheid met de nuances van het onderwerp

---

Verhaal

In een e-commerce project probeerde een ontwikkelaar meer dan twee elementen in een tuple [string, number] op te slaan met behulp van push. Dit gaf geen foutmelding tijdens de compilatie, maar brak de werking van een functie die precies twee elementen verwachtte, wat leidde tot fouten bij het afhandelen van bestellingen.

---

Verhaal

Een functie gaf een tuple [string, number] terug, maar de consument verwachtte een array van strings. De type mismatch leidde tot een moeilijk te identificeren fout, waardoor onnauwkeurige waarden in productie terechtkwamen.

---

Verhaal

Bij de migratie van code van JavaScript naar TypeScript werden arrays in plaats van tuples gebruikt om meerdere waarden van verschillende types terug te geven. Dit schond de strikte typing en leidde tot bugs in de volgende code, die afhankelijk was van de volgorde en het type van de waarden.