TypeScript Academy · Oppitunti

Builder-mallin perusteet

Rakentakaa monimutkaisia objekteja vaihe vaiheelta.

Oppitunti 1/413 vaihetta

Builder-mallin perusteet on ilmainen TypeScript Academy-oppitunti CoddyKitissä. Tämä on oppitunti 1/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.

Miksi käyttää rakentajaa?

Joissakin olioissa on paljon kenttiä, ja niiden luominen suurella konstruktorilla, joka sisältää joukon järjestyksestä riippuvia argumentteja, on virhealtista. Builder-malli rakentaa monimutkaisen olion vaihe vaiheelta, yksi nimetyn metodikutsun avulla kerrallaan.

Haluttu olio

Ajatellaan HTTP-pyyntöä, jolla on URL, metodi, otsakkeet ja runko. Kaikkien näiden välittäminen yhdelle konstruktorille vaikeuttaa koodin lukemista. Rakentajan avulla jokainen osa voidaan asettaa selkeästi nimetyn metodin avulla.

interface HttpRequest {
  url: string;
  method: string;
  headers: Record<string, string>;
  body?: string;
}

Perusrakentajaluokka

Rakentaja säilyttää osittaisen tilan sisäisesti ja tarjoaa asetusmetodeja. Jokainen asetusmetodi muuttaa sisäistä tilaa ja vastaa yhdestä kentästä.

class RequestBuilder {
  private url = "";
  private method = "GET";
  private headers: Record<string, string> = {};
  private body?: string;
}

Metodiketjutus palauttaa this-arvon

Rakentajien sujuvan luettavuuden mahdollistaa se, että jokainen asetusmetodi palauttaa this-arvon. Koska jokainen metodi palauttaa saman rakentajan, metodikutsuja voi ketjuttaa yhteen.

class RequestBuilder {
  private url = "";
  setUrl(u: string): this {
    this.url = u;
    return this;
  }
}

Lisää vaiheita

Jokainen määritysvaihe noudattaa samaa mallia: tallenna arvo ja palauta sitten this. Huomaa, että paluutyyppi this säilyttää konkreettisen rakentajatyypin koko ketjun ajan.

  setMethod(m: string): this {
    this.method = m;
    return this;
  }
  addHeader(k: string, v: string): this {
    this.headers[k] = v;
    return this;
  }

build()-metodi

Lopuksi build()-metodi kokoaa kertyneen tilan valmiiksi olioksi. Tämä on ainoa metodi, joka ei palauta rakentajaa.

  build(): HttpRequest {
    return {
      url: this.url,
      method: this.method,
      headers: this.headers,
      body: this.body,
    };
  }

Rakentajan käyttäminen

Nyt rakentaminen muistuttaa lausetta. Jokainen vaihe on nimetty, järjestys on joustava, eikä sinun tarvitse enää käsitellä järjestyksestä riippuvia argumentteja.

const req = new RequestBuilder()
  .setUrl("https://api.test")
  .setMethod("POST")
  .addHeader("Accept", "application/json")
  .build();
console.log(req.method);

Täydellinen suoritettava esimerkki

Tässä on itsenäinen versio, jonka voit suorittaa. Rakentaja kerää tilan, ja build() tuottaa lopullisen, muuttumattomalta vaikuttavan olion.

interface Req { url: string; method: string }
class B {
  private url = ""; private method = "GET";
  setUrl(u: string): this { this.url = u; return this; }
  setMethod(m: string): this { this.method = m; return this; }
  build(): Req { return { url: this.url, method: this.method }; }
}
const r = new B().setUrl("/users").setMethod("POST").build();
console.log(r.url, r.method);

Oletusarvot tulevat automaattisesti

Koska rakentaja alustaa kentät järkevillä oletusarvoilla, kutsujan tarvitsee muuttaa vain tarvitsemiaan arvoja. Asettamatta jätetyt vaiheet säilyttävät oletusarvonsa.

const getReq = new B().setUrl("/health").build();
console.log(getReq.method); // GET (default)

Luettavuus verrattuna konstruktoreihin

Vertaa new Req("/x", "POST", {}, undefined)-kutsua ketjutettuun rakentajaan. Rakentajaversio ilmaisee tarkoituksen jokaisessa vaiheessa ja välttää arvoitukselliset undefined-paikanvaraajat.

Milloin rakentajaa kannattaa käyttää

Käytä rakentajaa, kun oliolla on paljon valinnaisia osia, kun rakentaminen tapahtuu vaiheittain tai kun haluat helppolukuisen ja itsensä dokumentoivan rajapinnan. Jos kenttiä on kaksi tai kolme, tavallinen olion literaali on yksinkertaisempi.

Pikatarkistus

Tässä oppitunnin pikatarkistus.

Vastaa interaktiivisessa oppitunnissa

Kertaus

Rakentaja muodostaa monimutkaisia olioita vaiheittain. Setter-metodit tallentavat kukin yhden kentän ja palauttavat this-arvon, jotta kutsuja voidaan ketjuttaa. build() kokoaa lopullisen olion. Rakentajista on erityisesti hyötyä, kun olioilla on paljon valinnaisia osia.

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 ”Builder-mallin perusteet” ilmainen?

Kyllä – oppitunnin ”Builder-mallin perusteet” 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 ”Builder-mallin perusteet”?

Rakentakaa monimutkaisia objekteja vaihe vaiheelta. 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 1/4.

Kuinka kauan ”Builder-mallin perusteet”-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