Comprendere Arrays, Tuples ed Enums in TypeScript

TypeScript arricchisce JavaScript aggiungendo i tipi statici, rendendo più facile rilevare gli errori in anticipo e migliorando la leggibilità e la manutenibilità del codice. Tra le numerose funzionalità offerte, gli array, le tuple e gli enum sono concetti fondamentali che ogni sviluppatore dovrebbe comprendere. In questo post, esploreremo ciascuna di queste caratteristiche, spiegando il loro scopo, come si differenziano e come utilizzarle efficacemente nel tuo codice.

Arrays

In JavaScript, gli array sono una raccolta di elementi che possono essere di qualsiasi tipo. TypeScript costruisce su questo permettendo di specificare il tipo degli elementi all’interno di un array, garantendo che tutti gli elementi memorizzati nell’array siano dello stesso tipo. Questo può aiutare a evitare potenziali errori di runtime e migliorare la qualità del codice.

Dichiarazione degli Array

Per dichiarare un array, puoi utilizzare due diverse sintassi:

Usando le parentesi quadre ([]):

let numbers: number[] = [1, 2, 3, 4, 5];

Usando il tipo generico Array:

let numbers: Array<number> = [1, 2, 3, 4, 5];

Entrambe queste notazioni dichiarano un array di numeri, ma la scelta della sintassi è una questione di preferenza. L’idea principale è che l’array accetterà solo elementi del tipo specificato, fornendo una migliore sicurezza dei tipi.

Operazioni sugli Array

Gli array in TypeScript funzionano in modo simile a quelli in JavaScript. Puoi accedere agli elementi tramite il loro indice, usare metodi come .push(), .pop(), e .map(), ma con il beneficio aggiunto del controllo dei tipi:

let colors: string[] = ["red", "green", "blue"];
colors.push("yellow"); // This is valid
colors.push(123); // Error: Argument of type 'number' is not assignable to parameter of type 'string'

Tuples

Mentre gli array sono ottimi per elenchi di elementi dello stesso tipo, a volte hai bisogno di lavorare con una raccolta di dimensioni fisse in cui i tipi degli elementi possono differire. È qui che entrano in gioco le tuple. Una tupla ti permette di definire un array con elementi di tipi diversi e imporre una lunghezza specifica per l’array.

Dichiarazione delle Tuples

Per dichiarare una tupla, definisci i tipi degli elementi nell’array:

let user: [string, number, boolean] = ["Alice", 30, true];

Qui, user è una tupla con tre elementi:

• Una stringa (il nome dell’utente)
• Un numero (l’età dell’utente)
• Un booleano (lo stato attivo dell’utente)

Le tuple sono ideali per scenari in cui è necessario memorizzare più valori correlati di tipi diversi, ma si vuole garantire che i tipi e l’ordine degli elementi siano rispettati.

Accesso agli Elementi della Tupla

L’accesso agli elementi di una tupla è simile a quello degli array. Puoi usare gli indici per recuperare i valori, ma TypeScript farà rispettare i tipi in base alla dichiarazione della tupla:

let user: [string, number, boolean] = ["Alice", 30, true];

let name = user[0]; // string
let age = user[1]; // number
let isActive = user[2]; // boolean

Se provi ad assegnare un valore del tipo errato, TypeScript ti darà un errore:

user[1] = "thirty"; // Error: Type 'string' is not assignable to type 'number'

Enums

Gli enum sono una funzionalità potente in TypeScript che ti permette di definire un insieme di costanti nominate. Possono rendere il tuo codice più leggibile e ridurre gli errori fornendo nomi significativi al posto dei valori hardcoded.

Dichiarazione degli Enums

Gli enum possono essere numerici o basati su stringhe. Per impostazione predefinita, gli enum numerici partono da 0, ma puoi specificare il valore iniziale o assegnare valori esplicitamente.

Enum numerici:

enum Direction {
  Up, // 0
  Down, // 1
  Left, // 2
  Right, // 3
}

let direction: Direction = Direction.Up;
console.log(direction); // Output: 0

Puoi anche specificare valori iniziali personalizzati:

enum Direction {
  Up = 1,
  Down,
  Left,
  Right,
}

let direction: Direction = Direction.Left;
console.log(direction); // Output: 3

In questo esempio, Direction.Up inizia da 1, e gli altri valori vengono incrementati automaticamente.

Enum di stringhe:

Gli enum di stringhe ti permettono di assegnare valori stringa a ciascuna costante, il che può essere utile quando è necessario usare valori più descrittivi.

enum Direction {
  Up = "UP",
  Down = "DOWN",
  Left = "LEFT",
  Right = "RIGHT",
}

let direction: Direction = Direction.Up;
console.log(direction); // Output: "UP"

Utilizzo degli Enums

Gli enum sono particolarmente utili quando è necessario definire un insieme fisso di valori correlati, come direzioni, codici di stato o ruoli utente. Forniscono una migliore leggibilità e riducono il rischio di errori di battitura.

function getDirection(direction: Direction): string {
  switch (direction) {
    case Direction.Up:
      return "Going Up";
    case Direction.Down:
      return "Going Down";
    default:
      return "Unknown direction";
  }
}

console.log(getDirection(Direction.Up)); // Output: "Going Up"

Conclusione

Gli array, le tuple e gli enum sono funzionalità fondamentali in TypeScript che aiutano a migliorare la struttura e la manutenibilità del tuo codice. Gli array sono ideali per memorizzare collezioni di elementi dello stesso tipo, mentre le tuple permettono di memorizzare valori eterogenei in un array di dimensione fissa. Gli enum, invece, rendono il tuo codice più leggibile e manutenibile utilizzando costanti nominate al posto di valori grezzi.