Array e Tuple

In JavaScript, gli array possono contenere qualsiasi tipo di elemento e possono crescere o ridursi in modo del tutto dinamico. TypeScript aggiunge il controllo statico dei tipi per garantire che le collezioni rimangano omogenee o che rispettino una struttura fissa di tipi.

Array (Collezioni Omogenee)

In TypeScript, ci sono due modi equivalenti per definire il tipo di un array contenente elementi dello stesso tipo:

1. Usare il tipo dell'elemento seguito dalle parentesi quadre ([]):

   TS

   Copia

   const numbers: number[] = [1, 2, 3];
   const strings: string[] = ['a', 'b', 'c'];

2. Usare il tipo generico Array<T>:

   TS

   Copia

   const numbers: Array<number> = [1, 2, 3];

Entrambe le sintassi sono perfettamente valide, ma la prima (type[]) è quella convenzionale e più comune in quasi tutti i progetti. Se provi ad inserire un valore non valido (es. numbers.push("hello") su un array di tipo number[]), TypeScript genererà un errore a tempo di compilazione.

Le Tuple (Strutture a dimensione fissa)

Una tupla è un tipo speciale di array che ha un numero fisso di elementi e in cui ogni elemento ha un tipo specifico predefinito in base alla sua esatta posizione.

Ad esempio, se vogliamo memorizzare una risposta HTTP composta da un codice di stato (numero) e un messaggio (stringa):

const response: [number, string] = [200, 'OK'];

In questo caso:

• Il primo elemento (response[0]) deve essere un number.
• Il secondo elemento (response[1]) deve essere una string.
• L'array deve essere inizializzato con esattamente 2 elementi.

Tuple Sola Lettura (readonly)

Un dettaglio importante sulle tuple in TypeScript è che a runtime sono comunque normali array JavaScript. Questo significa che metodi come .push() o .pop() sono tecnicamente disponibili e potrebbero alterare la lunghezza della tupla, bypassando parzialmente i controlli di tipo.

Per prevenire questo comportamento e garantire una vera immutabilità, possiamo usare il modificatore readonly:

const point: readonly [number, number] = [10, 20];
// point.push(30); // Errore a tempo di compilazione!

Prova tu

Esercizio 1: Array di Numeri

Esercizio 2: Tupla Coordinate 3D

Esercizio 3: Tupla Informazioni Posizione

Esercizio 4: Tupla Riga di Log