Tema
/
Interneto svetainių kliento dalies kūrimas JS

src/state.ts — Readonly būsena

Kodo stulpelyje — src/state.ts. Tai 9 pamokos pub/sub, dabar tipizuotas — su viena esmine apsauga.

getState() grąžina Readonly<AppState>:

export function getState(): Readonly<AppState> {
  return state;
}

Readonly<T> padaro visus laukus tik skaitomus. Vaizdas gali getState().pictures perskaityti, bet:

getState().pictures = [];          // ❌ Cannot assign to 'pictures' because it is read-only

nekompiliuojasi. Tai kalba užtikrina 9 pamokos susitarimą: būseną keisti galima tik per veiksmus (setPictures, setStatus, setSort), kurie baigiasi notify(). Vanilla versijoje tai buvo tik drausmė; dabar — kompiliatoriaus taisyklė.

catch (error) yra unknown — trečia idėja, errors.ts faile:

export function toMessage(error: unknown): string {   // unknown, NE any
  if (error instanceof AppError) return error.message;
  if (error instanceof Error) return error.message;
  return 'Something went wrong.';
}

Kodėl unknown? Nes JavaScript leidžia mesti bet ką: throw 42, throw 'oops', throw null. Todėl catch bloke TypeScript tipina klaidą kaip unknown ir verčia susiaurinti (instanceof) prieš naudojant. Su any galėtum rašyti error.message ant skaičiaus ir lūžtum vykdymo metu.

Patikrink.

getState().searchQuery = 'x';      // ❌ read-only
setSearchQuery('x');               // ✅ per veiksmą

// state.ts getFilteredSaved: switch (state.sortKey) be `default` —
// pridėk SortKey ketvirtą reikšmę, ir switch nustos kompiliuotis.

Patarimas. Readonly<AppState> „skaitomumas" — paviršinis (tik pirmo lygio laukai). Giliai įdėtiems objektams yra DeepReadonly šablonai, bet dažniausiai ir paviršinio užtenka: jis pagauna dažniausią klaidą — vaizdą, bandantį tiesiogiai perrašyti būseną vietoj veiksmo.