TypeScript Academy · Oppitunti

ReadonlyArray ja ReadonlyMap

Käyttäkää sisäänrakennettuja readonly-kokoelmatyyppejä.

Oppitunti 3/413 vaihetta

ReadonlyArray ja ReadonlyMap on ilmainen TypeScript Academy-oppitunti CoddyKitissä. Tämä on oppitunti 3/4. Voit lukea koko oppitunnin alta ilmaiseksi ja harjoitella sen jälkeen käytännössä selaimessa sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla. Oppitunti kuuluu TypeScript Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. TypeScript Academy-kurssilla on yhteensä 4 oppituntia.

Readonly-kokoelmatyypit

Taulukoiden lisäksi TypeScript tarjoaa sisäänrakennetuista kokoelmistaan readonly-versiot: ReadonlyArray<T>, ReadonlyMap<K, V> ja ReadonlySet<T>. Kukin niistä tarjoaa vain API:n osat, jotka eivät muuta kokoelmaa.

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

ReadonlyArray-kertaus

ReadonlyArray<T> sallii läpikäynnin, indeksoinnin ja map- ja filter-metodien kaltaiset operaatiot, mutta ei push- tai pop-kutsuja eikä indeksin sijoittamista. Se on readonly-perheen taulukkomuoto.

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

ReadonlyMap

ReadonlyMap<K, V> mahdollistaa hakemisen, läpikäynnin ja avainten tarkistamisen, mutta siitä puuttuvat set-, delete- ja clear-toiminnot. Kokoelman sisältö on kuluttajan näkökulmasta muuttumaton.

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

Tietojen lukeminen ReadonlyMapista

Kaikki lukuoperaatiot säilyvät: get, has, size, keys, values, entries ja läpikäynti. Vain muuttavat metodit puuttuvat.

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> tukee jäsenyyden tarkistamista ja läpikäyntiä, mutta siitä puuttuvat add-, delete- ja clear-toiminnot. Käyttäkää sitä sallittujen arvojen muuttumattomille joukoille.

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

ReadonlySetin läpikäynti

Voitte käydä ReadonlySet-kokoelman läpi ja lukea sen size-arvon, mutta ette voi muuttaa sen sisältöä. Siksi se sopii erinomaisesti sallittujen arvojen luetteloihin ja käyttöoikeusjoukkoihin.

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

Readonly-tyypin välittäminen funktioille

Hyväksykää funktioissa readonly-kokoelmatyyppi, kun funktion tulee vain lukea tietoja. Se ilmaisee tarkoituksen ja estää funktiota muuttamasta kutsujan omistamaa dataa.

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

Muuttuvat kokoelmat ovat sijoitettavissa

Tavallinen Map tai Set voidaan sijoittaa readonly-vastineeseensa, koska tällöin kavennetaan kyvykkyyksiä eikä laajenneta niitä. Funktio yksinkertaisesti luopuu muutosoikeuksista.

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

Muuttumattomat kokoelma-API:t

Readonly-kokoelmatyypit kuvaavat muuttumatonta näkymää. Taustalla oleva objekti voi silti olla muualla muuttuva; readonly-tyyppi rajoittaa vain sitä, mitä tämä viite voi tehdä.

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

Oikean readonly-tyypin valitseminen

Valitkaa readonly-tyyppi tietorakenteen mukaan: ReadonlyArray järjestetyille listoille, ReadonlyMap avain–arvo-hakuihin ja ReadonlySet yksilöllisen jäsenyyden käsittelyyn. Kukin niistä valvoo tietorakenteensa muuttumattomuutta.

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

Turvallisempi jaettu tila

Sisäisten kokoelmien tarjoaminen readonly-tyyppeinä estää kutsujia turmelemasta moduulin tilaa. He voivat tarkastella tietoja vapaasti, mutta vain oma koodinne voi muuttaa niitä.

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

Pikatarkistus

Testatkaa, miten hyvin ymmärrätte readonly-kokoelmatyypit.

Vastaa interaktiivisessa oppitunnissa

Kertaus: readonly-kokoelmat

Opitte tuntemaan readonly-kokoelmien perheen:

ReadonlyArray<T>, ReadonlyMap<K, V> ja ReadonlySet<T> tarjoavat vain lukuoperaatiot.
Muuttavat metodit (set, add, delete, push) puuttuvat.
Muuttuvat kokoelmat voidaan sijoittaa niiden readonly-vastineisiin.
Ne sopivat erinomaisesti parametri- ja palautustyypeiksi, kun jaetun tilan turvallisuutta halutaan parantaa.

Lopuksi käsitellään syvän muuttumattomuuden malleja.

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

Aloita maksutta

Opi TypeScript tekoälytuutorin avulla — ilmaiseksi

Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.

Kurssit: 101
Oppitunnit: 352

Aloita opiskelu maksutta Näytä koko kurssi

Usein kysytyt kysymykset

Onko oppitunti ”ReadonlyArray ja ReadonlyMap” ilmainen?

Kyllä – oppitunnin ”ReadonlyArray ja ReadonlyMap” koko tekstin voi lukea täällä verkossa ilmaiseksi. Jos haluat harjoitella interaktiivisesti sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla sekä avata koko TypeScript Academy-kurssin, päivitä CoddyKit PROhon. TypeScript Academy-kurssilla on yhteensä 4 oppituntia.

Mitä opin oppitunnilla ”ReadonlyArray ja ReadonlyMap”?

Käyttäkää sisäänrakennettuja readonly-kokoelmatyyppejä. Harjoittelet TypeScript Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni TypeScript Academy-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin TypeScript Academy-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 3/4.

Kuinka kauan ”ReadonlyArray ja ReadonlyMap”-oppitunnin suorittaminen kestää?

Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.

Voinko kirjoittaa ja suorittaa koodia tällä TypeScript Academy-oppitunnilla?

Kyllä. Jokainen TypeScript Academy-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.

Kaikki tämän kurssin oppitunnit

← Takaisin: TypeScript Academy