TypeScript Academy · Lezione

ReadonlyArray e ReadonlyMap

Utilizzi i tipi di raccolta readonly integrati.

ReadonlyArray e ReadonlyMap è una lezione TypeScript Academy gratuita su CoddyKit. Questa è la lezione 3 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.

Tipi di collezione in sola lettura

Oltre agli array, TypeScript offre varianti in sola lettura delle collezioni incorporate: ReadonlyArray<T>, ReadonlyMap<K, V> e ReadonlySet<T>. Ognuna espone solo le parti non mutanti della propria API.

const arr: ReadonlyArray<number> = [1, 2, 3];
console.log(arr.length, arr.includes(2));

Riepilogo di ReadonlyArray

ReadonlyArray<T> consente l'iterazione, l'accesso tramite indice e metodi come map e filter, ma non push, pop o l'assegnazione tramite indice. È la variante array della famiglia in sola lettura.

const tags: ReadonlyArray<string> = ['ts', 'js'];
console.log(tags.map((t) => t.toUpperCase()));
// tags.push('css'); // Error

ReadonlyMap

ReadonlyMap<K, V> consente di cercare valori, iterare e verificare le chiavi, ma rimuove set, delete e clear. Dal punto di vista del consumatore, il contenuto della mappa è fisso.

const ages: ReadonlyMap<string, number> = new Map([['Ada', 30], ['Sam', 25]]);
console.log(ages.get('Ada'), ages.has('Sam'));
// ages.set('Lee', 40); // Error

Leggere da una ReadonlyMap

Restano disponibili tutte le operazioni di lettura: get, has, size, keys, values, entries e l'iterazione. Vengono rimossi solo i metodi che modificano i dati.

const m: ReadonlyMap<string, number> = new Map([['a', 1], ['b', 2]]);
for (const [k, v] of m) {
  console.log(k, v);
}
console.log('size:', m.size);

ReadonlySet

ReadonlySet<T> supporta i controlli di appartenenza e l'iterazione, ma rimuove add, delete e clear. Lo utilizzi per insiemi fissi di valori consentiti.

const allowed: ReadonlySet<string> = new Set(['read', 'write']);
console.log(allowed.has('read'), allowed.has('delete'));
// allowed.add('admin'); // Error

Iterare su una ReadonlySet

È possibile iterare su una ReadonlySet e leggerne size, ma non modificarne il contenuto. Questo la rende ideale per whitelist e insiemi di autorizzazioni.

const perms: ReadonlySet<string> = new Set(['view', 'edit']);
perms.forEach((p) => console.log('perm:', p));
console.log('count:', perms.size);

Passare collezioni in sola lettura alle funzioni

Accetti un tipo di collezione in sola lettura nelle funzioni che devono soltanto leggere. In questo modo comunica l'intento e impedisce alla funzione di modificare i dati posseduti dal chiamante.

function describe(set: ReadonlySet<string>): string {
  return 'has ' + set.size + ' items';
}
const s = new Set(['x', 'y']);
console.log(describe(s));

Le collezioni mutabili sono assegnabili

Un normale Map o Set è assegnabile alla variante in sola lettura corrispondente, perché si stanno restringendo le capacità, non ampliandole. La funzione rinuncia semplicemente ai diritti di modifica.

function keys(m: ReadonlyMap<string, number>): string[] {
  return Array.from(m.keys());
}
const real = new Map([['a', 1]]);
console.log(keys(real));

API delle collezioni immutabili

I tipi di collezione in sola lettura descrivono una vista immutabile. L'oggetto sottostante può essere ancora modificabile altrove; il tipo in sola lettura limita solo le operazioni consentite da questo riferimento.

const backing = new Set<number>([1, 2]);
const view: ReadonlySet<number> = backing;
// view.add(3); // Error through the readonly view
backing.add(3); // but the original can still mutate
console.log(view.size);

Scegliere il tipo in sola lettura corretto

Scelga il tipo in sola lettura in base alla struttura dei dati: ReadonlyArray per gli elenchi ordinati, ReadonlyMap per le ricerche chiave-valore, ReadonlySet per l'appartenenza di valori unici. Ognuno impone l'immutabilità per la propria struttura.

const roles: ReadonlySet<string> = new Set(['admin', 'user']);
const limits: ReadonlyMap<string, number> = new Map([['admin', 100]]);
console.log(roles.has('user'), limits.get('admin'));

Stato condiviso più sicuro

Esporre le collezioni interne come tipi in sola lettura impedisce ai chiamanti di danneggiare lo stato del modulo. Possono esaminare liberamente i dati, ma solo il Suo codice può modificarli.

class Registry {
  private items = new Set<string>();
  add(name: string): void { this.items.add(name); }
  get all(): ReadonlySet<string> { return this.items; }
}
const r = new Registry();
r.add('a');
console.log(r.all.has('a'));

Verifica rapida

Verifichi la Sua comprensione dei tipi di collezione in sola lettura.

Riepilogo: collezioni in sola lettura

Ha imparato la famiglia delle collezioni in sola lettura:

ReadonlyArray<T>, ReadonlyMap<K, V> e ReadonlySet<T> espongono solo operazioni di lettura.
I metodi che modificano i dati (set, add, delete, push) vengono rimossi.
Le collezioni mutabili sono assegnabili alle rispettive varianti in sola lettura.
Sono ottimi tipi per parametri e valori restituiti, per uno stato condiviso più sicuro.

Infine, vedrà i pattern di immutabilità profonda.

function count(s: ReadonlySet<number>): number {
  return s.size;
}
console.log(count(new Set([1, 2, 3])));

Domande Frequenti

La lezione «ReadonlyArray e ReadonlyMap» è gratuita?

Sì — il testo completo di «ReadonlyArray e ReadonlyMap» è 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 «ReadonlyArray e ReadonlyMap»?

Utilizzi i tipi di raccolta readonly integrati. 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 3 di 4.

Quanto tempo richiede la lezione «ReadonlyArray e ReadonlyMap»?

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

← Torna a TypeScript Academy