TypeScript Academy · Lezione

Array Readonly e dati immutabili

Utilizzi ReadonlyArray per prevenire modifiche accidentali.

Array Readonly e dati immutabili è una lezione TypeScript Academy gratuita su CoddyKit. Questa è la lezione 2 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento TypeScript Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso TypeScript Academy include 4 lezioni in totale.

Benvenuto

Gli array mutabili possono essere modificati accidentalmente in qualsiasi punto del codice. ReadonlyArray e il modificatore readonly di TypeScript aiutano a imporre l'immutabilità.

Il modificatore readonly sugli array

Aggiunga il modificatore `readonly` prima del tipo dell'array per impedirne la modifica. L'array può essere letto, ma non modificato.

const ids: readonly number[] = [1, 2, 3];
// ids.push(4);   // Error
// ids[0] = 99;   // Error
console.log(ids[0]); // OK — reading is fine

La forma generica ReadonlyArray<T>

`ReadonlyArray` è l'equivalente generico di `readonly T[]`. Entrambi impediscono l'uso di push, pop, splice e l'assegnazione tramite indice.

const names: ReadonlyArray<string> = ['Alice', 'Bob'];
// names.push('Charlie'); // Error

Restituire array readonly dalle funzioni

Restituisca array readonly dalle funzioni per comunicare ai chiamanti che il risultato non dovrebbe essere modificato.

function getConfig(): readonly string[] {
  return ['host', 'port', 'db'];
}

Parametri di funzione immutabili

Dichiari come readonly i parametri array per impedire alla funzione di modificare l'array del chiamante.

function sum(nums: readonly number[]): number {
  return nums.reduce((a, b) => a + b, 0);
  // nums.push(99); // Error inside function
}

as const per gli array literal

L'asserzione `as const` rende un array readonly e ne deduce un tipo tupla con tipi degli elementi literal invece di tipi ampliati.

const colors = ['red', 'green', 'blue'] as const;
// type: readonly ['red', 'green', 'blue']
// colors.push('yellow'); // Error

Readonly non congela in profondità

readonly impedisce solo di modificare l'array tramite quel riferimento. Se gli elementi sono oggetti, le loro proprietà possono comunque essere modificate.

const users: readonly { name: string }[] = [{ name: 'Alice' }];
// users.push({}); // Error
users[0].name = 'Bob'; // Allowed — object itself is mutable

Immutabilità profonda con Readonly<T>

Per ottenere l'immutabilità profonda degli oggetti, combini ReadonlyArray con Readonly sugli elementi. In alternativa, utilizzi una libreria come immer.

type ImmutableUser = Readonly<{ name: string; scores: readonly number[] }>;
const u: ImmutableUser = { name: 'Alice', scores: [90, 85] };
// u.name = 'Bob';       // Error
// u.scores.push(100);  // Error

Assegnazione tra array mutabili e readonly

Un array readonly NON è assegnabile a un tipo di array mutabile. Questo protegge dal passaggio accidentale di un array immutabile quando è prevista una modifica.

const ro: readonly number[] = [1, 2];
const mutable: number[] = ro; // Error!

Quando utilizzare gli array readonly

Utilizzi gli array readonly per gli oggetti di configurazione, le costanti, i parametri delle funzioni che si impegna a non modificare e i valori restituiti dalle funzioni pure.

Lo spread crea un nuovo array mutabile

L'uso dello spread di un array readonly in un nuovo literal di array crea una copia mutabile. È un modello pulito per apportare modifiche senza mutare l'originale.

const base: readonly number[] = [1, 2, 3];
const extended: number[] = [...base, 4]; // new mutable array

Verifica rapida

Quale operazione NON è consentita su un `readonly number[]` in TypeScript?

Riepilogo

Utilizzi `readonly T[]` o `ReadonlyArray` per impedire la modifica degli array. Utilizzi `as const` per gli array literal costanti. Lo spread crea una copia mutabile quando è necessario estendere un array readonly.

Domande Frequenti

La lezione «Array Readonly e dati immutabili» è gratuita?

Sì — il testo completo di «Array Readonly e dati immutabili» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso TypeScript Academy, passa a CoddyKit PRO. Il corso TypeScript Academy include 4 lezioni in totale.

Cosa imparerò in «Array Readonly e dati immutabili»?

Utilizzi ReadonlyArray per prevenire modifiche accidentali. Eserciti TypeScript Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.

Ho bisogno di esperienza per iniziare TypeScript Academy?

Non è richiesta alcuna esperienza precedente. TypeScript Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 2 di 4.

Quanto tempo richiede la lezione «Array Readonly e dati immutabili»?

La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.

Posso scrivere ed eseguire codice in questa lezione TypeScript Academy?

Sì. Ogni lezione TypeScript Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.

Tutte le lezioni di questo corso

Array tipizzati: T[] e Array
Array Readonly e dati immutabili
Tuple: array tipizzati di lunghezza fissa
Enum: costanti numeriche e stringa

← Torna a TypeScript Academy