TypeScript Academy · Lekcja

Niezmienne obiekty Builder

Zwracaj nowe instancje Buildera, aby bezpieczniej je składać

Niezmienne obiekty Builder to bezpłatna lekcja TypeScript Academy na CoddyKit. To lekcja 4 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej TypeScript Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs TypeScript Academy zawiera 4 lekcji w sumie.

Mutowalność a niemutowalność

Dotychczasowe buildery modyfikują this i je zwracają. Niemutowalny builder zamiast tego przy każdym kroku zwraca nową instancję buildera i nigdy nie zmienia oryginalnej. Dzięki temu składanie staje się bezpieczniejsze.

Problem ze współdzieloną mutacją

Jeśli dwie części kodu przechowują ten sam mutowalny builder, wywołanie jednego settera wpływa na obie. Niemutowalne buildery całkowicie eliminują tę niespodziewaną zmianę za pośrednictwem aliasu.

const base = makeMutableBuilder().url("/x");
// If base is shared, later .method() calls mutate everyone's copy.

Zwracanie nowej instancji

Niemutowalny setter kopiuje bieżący stan, dodaje nowe pole i tworzy nowy builder. Oryginalny pozostaje nietknięty.

class IB<S> {
  constructor(private readonly d: Record<string, unknown> = {}) {}
  with<K extends string, V>(k: K, v: V): IB<S & Record<K, V>> {
    return new IB<S & Record<K, V>>({ ...this.d, [k]: v });
  }
}

Współdzielenie strukturalne za pomocą spread

Spread { ...this.d, [k]: v } kopiuje istniejące wpisy i nadpisuje jeden klucz. Niezmienione wartości są współdzielone przez referencję, więc kopie pozostają tanie.

const a = new IB<{}>().with("url", "/x");
const c = a.with("method", "GET");
// a still only has url; c has url and method.

Oryginały nigdy się nie zmieniają

Ponieważ każdy krok tworzy nowy obiekt, rozgałęzianie od wcześniejszego buildera jest bezpieczne. Można używać częściowo zbudowanej bazy w wielu miejscach.

const base = new IB<{}>().with("url", "/api");
const get = base.with("method", "GET");
const post = base.with("method", "POST");
console.log("base untouched; get and post diverge");

Wewnętrzny stan tylko do odczytu

Oznaczenie danych wewnętrznych jako readonly dokumentuje zamierzone zachowanie i zapobiega przypadkowym zapisom w miejscu wewnątrz klasy. Jedynym sposobem kontynuowania jest utworzenie nowej instancji.

class IB<S> {
  constructor(private readonly d: Readonly<Record<string, unknown>> = {}) {}
}

Typowane budowanie niemutowalne

Parametr stanu nadal jest przekazywany przez kolejne kroki, więc można warunkować build() dokładnie tak jak wcześniej, tym razem na niemutowalnej podstawie.

interface Out { url: string; method: string }
class IB<S> {
  constructor(private readonly d: Record<string, unknown> = {}) {}
  with<K extends string, V>(k: K, v: V): IB<S & Record<K, V>> {
    return new IB<S & Record<K, V>>({ ...this.d, [k]: v });
  }
  build(this: IB<{ url: string; method: string }>): Out { return this.d as Out; }
}
const out = new IB<{}>().with("url", "/u").with("method", "GET").build();
console.log(out.url);

Bezpieczniejsze składanie

Niemutowalne buildery można składać jak wartości: przekazywać je dalej, tworzyć na ich podstawie nowe i nie martwić się, że późniejsze wywołanie zmieni współdzielony stan. To ta sama korzyść, którą niemutowalne dane zapewniają w każdym miejscu programu.

Wielokrotnego użytku ustawienia wstępne

Można raz zapisać często używany punkt początkowy i wielokrotnie tworzyć od niego odgałęzienia. Każde odgałęzienie jest niezależne dzięki setterom kopiującym przy zapisie.

const jsonBase = new IB<{}>().with("header", "application/json");
const usersReq = jsonBase.with("url", "/users");
const ordersReq = jsonBase.with("url", "/orders");
console.log("two independent requests from one base");

Kwestie kosztu

Każdy krok alokuje nowy obiekt. W przypadku typowego budowania konfiguracji jest to pomijalny koszt, a współdzielenie strukturalne sprawia, że kopie pozostają płytkie. Zauważalny byłby on tylko w wyjątkowo intensywnie wykonywanych pętlach.

Podsumowanie builderów mutowalnych i niemutowalnych

Buildery mutowalne są nieco szybsze i prostsze, natomiast niemutowalne są bezpieczniejsze do współdzielenia i łatwiejsze do analizowania. Warto wybierać niemutowalne, gdy buildery są przekazywane dalej albo ponownie używane jako ustawienia wstępne.

Szybkie sprawdzenie

Szybkie sprawdzenie wiadomości z tej lekcji.

Podsumowanie

Niemutowalny builder przy każdym kroku zwraca nową instancję, wykorzystując współdzielenie strukturalne { ...this.d, [k]: v }, i nigdy nie modyfikuje this. Oryginały pozostają niezmienione, co umożliwia bezpieczne składanie i wielokrotne używanie ustawień wstępnych przy niewielkim koszcie alokacji.

Często zadawane pytania

Czy lekcja „Niezmienne obiekty Builder” jest bezpłatna?

Tak — pełny tekst „Niezmienne obiekty Builder” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu TypeScript Academy, przejdź na CoddyKit PRO. Kurs TypeScript Academy zawiera 4 lekcji w sumie.

Co nauczysz się w „Niezmienne obiekty Builder”?

Zwracaj nowe instancje Buildera, aby bezpieczniej je składać Ćwiczysz TypeScript Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.

Czy potrzebuję doświadczenia, aby zacząć TypeScript Academy?

Nie wymagamy żadnego doświadczenia. TypeScript Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 4 z 4.

Ile czasu zajmuje lekcja „Niezmienne obiekty Builder”?

Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.

Czy mogę pisać i uruchamiać kod w tej lekcji TypeScript Academy?

Tak. Każda lekcja TypeScript Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.

Wszystkie lekcje w tym kursie

← Powrót do TypeScript Academy