TypeScript Academy · Lektion

Fluent interfaces med typer

Kedja metoder och spåra ackumulerat tillstånd i typerna.

Lektion 2 av 413 steg

Fluent interfaces med typer är en gratis lektion i TypeScript Academy på CoddyKit. Detta är lektion 2 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.

Spåra vad som har angetts

En vanlig builder låter dig anropa build() när som helst, även om obligatoriska fält saknas. Vi kan göra det bättre genom att spåra det ackumulerade tillståndet i typsystemet med hjälp av en generisk typparameter.

En tillståndstypparameter

Vi ger buildern ett generiskt S som registrerar vilka nycklar som har angetts hittills. När varje metod körs breddar vi S så att den även omfattar en ny nyckel.

class Builder<S> {
  // S is a record of keys set so far, e.g. {} or { url: string }
  private data: Record<string, unknown> = {};
}

Varje metod lägger till en nyckel

En setter-metod returnerar en ny typad builder vars S innehåller den nyss tillagda nyckeln. Vid körning lagras värdet, och typen breddas på motsvarande sätt.

  set<K extends string, V>(key: K, value: V): Builder<S & Record<K, V>> {
    this.data[key] = value;
    return this as unknown as Builder<S & Record<K, V>>;
  }

Tricket med snitt

Uttrycket S & Record<K, V> bildar snittet mellan det tidigare tillståndet och den nya nyckeln. Efter två anrop känner typen exakt till båda nycklarna.

type Empty = {};
type AfterUrl = Empty & Record<"url", string>;
type AfterBoth = AfterUrl & Record<"method", string>;
// AfterBoth = { url: string; method: string }

En konkret fluent builder

Här förmedlar en request-builder sin ackumulerade struktur genom varje anrop. Kompilatorn vet alltid exakt vilka fält som finns.

class Req<S> {
  private d: Record<string, unknown> = {};
  url(u: string): Req<S & { url: string }> {
    this.d.url = u; return this as any;
  }
  method(m: string): Req<S & { method: string }> {
    this.d.method = m; return this as any;
  }
}

Typen växer när du kedjar anrop

Varje anrop i kedjan skapar en mer specifik builder-typ. Om du håller muspekaren över resultatet i en editor visas det ackumulerade tillståndet.

const partial = new Req<{}>().url("/x");
// type: Req<{ url: string }>
const full = partial.method("POST");
// type: Req<{ url: string; method: string }>

Varför spåra tillstånd över huvud taget?

När typen innehåller mängden angivna nycklar kan vi senare begränsa build() så att den bara kan kompileras när obligatoriska nycklar finns med. Tillståndsparametern utgör grunden för den garantin.

Läs den ackumulerade strukturen

Du kan extrahera den ackumulerade strukturen för att granska den. Det bekräftar att builderns typ exakt återspeglar det som har konfigurerats.

type StateOf<T> = T extends Req<infer S> ? S : never;
type S1 = StateOf<Req<{ url: string }>>; // { url: string }

Körningen förblir enkel

All komplexitet finns i typerna. Vid körning lagrar varje setter-metod bara ett värde i ett objekt. Typkonverteringarna (as any) kopplar runtime-objektet till den mer omfattande typen vid kompilering.

const r = new Req<{}>().url("/users").method("GET");
console.log("configured url and method");

Generiskt tillstånd som liggare

Tänk på S som en liggare över det som har angetts. Metoderna lägger till poster, och byggsteget kan senare läsa liggaren för att avgöra om konstruktionen är tillåten.

Avvägningar

Spårning av tillstånd på typnivå ger exakt återkoppling i IDE:n och förhindrar ofullständiga byggen, men kostar några typkonverteringar och mer avancerade generics. Det lönar sig för API:er som används av många.

Kort kontroll

En kort kontroll av den här lektionen.

Sammanfattning

En fluent typed builder innehåller en generisk tillståndsparameter S. Varje setter-metod bildar snittet mellan S och den nya nyckeln (S & Record<K, V>) och returnerar en mer specifik builder, vilket ger kompilatorn en exakt liggare över de konfigurerade fälten.

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

Vanliga frågor

Är lektionen ”Fluent interfaces med typer” gratis?

Ja – hela texten till ”Fluent interfaces med typer” 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 ”Fluent interfaces med typer”?

Kedja metoder och spåra ackumulerat tillstånd i typerna. 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 2 av 4.

Hur lång tid tar lektionen ”Fluent interfaces med typer”?

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

  1. Grunderna i Builder Pattern
  2. Fluent interfaces med typer
  3. Säkerställ obligatoriska steg
  4. Oföränderliga builders
← Tillbaka till TypeScript Academy