TypeScript Academy · Lektion

ReadonlyArray och ReadonlyMap

Använd inbyggda readonly-samlingstyper.

Lektion 3 av 413 steg

ReadonlyArray och ReadonlyMap är en gratis lektion i TypeScript Academy på CoddyKit. Detta är lektion 3 av 4. Ni kan läsa hela lektionen gratis nedan och sedan öva praktiskt i webbläsaren med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt. Den ingår i lärvägen för TypeScript Academy, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i TypeScript Academy innehåller totalt 4 lektioner.

Skrivskyddade samlingstyper

Utöver arrayer tillhandahåller TypeScript skrivskyddade varianter av sina inbyggda samlingar: ReadonlyArray<T>, ReadonlyMap<K, V> och ReadonlySet<T>. Var och en exponerar endast de delar av sitt API som inte ändrar samlingen.

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

Sammanfattning av ReadonlyArray

ReadonlyArray<T> tillåter iteration, indexering och metoder som map och filter, men inte push, pop eller tilldelning till ett index. Det är arrayvarianten i den skrivskyddade familjen.

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

ReadonlyMap

ReadonlyMap<K, V> låter dig slå upp värden, iterera och kontrollera nycklar, men tar bort set, delete och clear. Kartans innehåll är oföränderligt ur användarens perspektiv.

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

Läsa från en ReadonlyMap

Alla läsoperationer finns kvar: get, has, size, keys, values, entries och iteration. Endast metoderna som ändrar samlingen har tagits bort.

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> stöder medlemskapskontroller och iteration, men tar bort add, delete och clear. Använd den för fasta uppsättningar av tillåtna värden.

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

Iterera över en ReadonlySet

Du kan iterera över en ReadonlySet och läsa dess size, men inte ändra innehållet. Därför passar den utmärkt för vitlistor och behörighetsuppsättningar.

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

Skicka skrivskyddade samlingar till funktioner

Acceptera en skrivskyddad samlingstyp i funktioner som bara ska läsa. Det kommunicerar avsikten och hindrar funktionen från att ändra data som ägs av anroparen.

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

Skrivbara samlingar kan tilldelas

En vanlig Map eller Set kan tilldelas till sin skrivskyddade motsvarighet, eftersom du begränsar möjligheterna i stället för att utökar dem. Funktionen avstår helt enkelt från rätten att ändra samlingen.

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

API:er för oföränderliga samlingar

Skrivskyddade samlingstyper beskriver en oföränderlig vy. Det underliggande objektet kan fortfarande vara ändringsbart någon annanstans; den skrivskyddade typen begränsar bara vad den här referensen kan göra.

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);

Välj rätt skrivskyddad typ

Matcha den skrivskyddade typen med din datastruktur: ReadonlyArray för ordnade listor, ReadonlyMap för uppslag med nyckel och värde, och ReadonlySet för unika medlemskap. Var och en upprätthåller oföränderlighet för sin struktur.

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'));

Säkrare delat tillstånd

Om du exponerar interna samlingar som skrivskyddade typer hindrar du anropare från att förstöra modulens tillstånd. De kan läsa data fritt, men bara din kod kan ändra den.

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'));

Snabb kontroll

Testa att du har förstått skrivskyddade samlingstyper.

Besvara frågan i den interaktiva lektionen

Sammanfattning: Skrivskyddade samlingar

Du har lärt dig den skrivskyddade samlingsfamiljen:

ReadonlyArray<T>, ReadonlyMap<K, V> och ReadonlySet<T> exponerar endast läsoperationer.
Metoder som ändrar samlingen (set, add, delete, push) tas bort.
Skrivbara samlingar kan tilldelas till sina skrivskyddade motsvarigheter.
De passar utmärkt som parameter- och returtyper för säkrare delat tillstånd.

Slutligen går vi igenom mönster för djup oföränderlighet.

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

Gratis att börja

Lär dig TypeScript med en AI-lärare – gratis

Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.

Kurser: 101
Lektioner: 352

Börja lära dig gratis Visa hela kursen

Vanliga frågor

Är lektionen ”ReadonlyArray och ReadonlyMap” gratis?

Ja – hela texten till ”ReadonlyArray och ReadonlyMap” kan läsas gratis här på webben. Om Ni vill öva interaktivt med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt och låsa upp resten av kursen i TypeScript Academy, kan Ni uppgradera till CoddyKit PRO. Kursen i TypeScript Academy innehåller totalt 4 lektioner.

Vad lär jag mig i ”ReadonlyArray och ReadonlyMap”?

Använd inbyggda readonly-samlingstyper. Ni övar på TypeScript Academy med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.

Behöver jag någon erfarenhet för att börja lära mig TypeScript Academy?

Du behöver inga förkunskaper. Utbildningen i TypeScript Academy på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 3 av 4.

Hur lång tid tar lektionen ”ReadonlyArray och ReadonlyMap”?

De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.

Kan jag skriva och köra kod i den här TypeScript Academy-lektionen?

Ja. Varje TypeScript Academy-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.

Alla lektioner i den här kursen

← Tillbaka till TypeScript Academy