PricingLoginStart free
TypeScript Academy · leksjon

Typesatte pipe- og flow-verktøy

Bygg rørledninger fra venstre mot høyre med nøyaktig inferens.

Leksjon 4 av 413 trinn

Typesatte pipe- og flow-verktøy er en gratis leksjon i TypeScript Academy på CoddyKit. Dette er leksjon 4 av 4. Du kan lese hele leksjonen gratis nedenfor – og deretter øve praktisk i nettleseren med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt. Den er en del av læringsløpet i TypeScript Academy, og fremdriften din synkroniseres mellom nettet og CoddyKit-appen. Kurset i TypeScript Academy inneholder totalt 4 leksjoner.

Fra compose til pipe

pipe fører en verdi gjennom funksjoner fra venstre mot høyre, som er leserekkefølgen de fleste foretrekker. pipe(x, f, g) betyr g(f(x)).

En pipe med to trinn

Den enkleste pipen tar en verdi og én funksjon og returnerer resultatet. Når De leser ovenfra og ned, samsvarer det med rekkefølgen funksjonene kjøres i.

const pipe2 = <A, B>(a: A, f: (a: A) => B): B => f(a);
console.log(pipe2(5, n => n + 1)); // 6

Gjennom flere funksjoner

En pipe med tre argumenter bruker funksjonene i rekkefølge. Outputen fra hvert trinn blir inputen til det neste trinnet.

function pipe<A, B, C>(a: A, f: (a: A) => B, g: (b: B) => C): C {
  return g(f(a));
}
const inc = (n: number) => n + 1;
const dbl = (n: number) => n * 2;
console.log(pipe(5, inc, dbl)); // 12

Lesing fra venstre mot høyre

I motsetning til compose viser pipe trinnene i den rekkefølgen de kjøres. pipe(5, inc, dbl) øker først og dobler deretter, akkurat som det står skrevet.

console.log(pipe(5, dbl, inc)); // 11 (double then inc)

Hvorfor overloads er nødvendige

Ulike kallesteder sender inn ulikt antall funksjoner. For å typesette hver aritet presist bruker pipe overload-signaturer, én for hver støttede lengde.

function pipe<A, B>(a: A, f: (a: A) => B): B;
function pipe<A, B, C>(a: A, f: (a: A) => B, g: (b: B) => C): C;
function pipe(a: unknown, ...fns: Function[]): unknown {
  return fns.reduce((v, fn) => fn(v), a);
}

Hver overload lenker typene

Overload to lenker A -> B, mens overload tre lenker A -> B -> C. Kompilatoren velger riktig overload basert på hvor mange funksjoner De sender inn.

Implementasjonen ved kjøring

Under overloadene bruker én enkelt reduce alle funksjonene etter tur. Implementasjonssignaturen bruker løse typer, mens kallere ser de presise overloadene.

function pipe(a: any, ...fns: Array<(x: any) => any>): any {
  return fns.reduce((acc, fn) => fn(acc), a);
}
console.log(pipe("  hi ", s => s.trim(), s => s.toUpperCase())); // HI

Typeendringer gjennom pipen

Fordi hver overload lenker generiske typer, kan en pipe transformere en verdi gjennom flere typer og fortsatt være fullstendig typesjekket.

const out = pipe("hello", s => s.length, n => n > 3);
console.log(out); // true (string -> number -> boolean)

flow: pipe uten verdien

flow ligner på pipe, men tar bare funksjonene og returnerer en ny funksjon. Verdien oppgis senere, noe som er praktisk når funksjonen skal gjenbrukes.

const flow = <A, B, C>(f: (a: A) => B, g: (b: B) => C) =>
  (a: A): C => g(f(a));
const process = flow((n: number) => n + 1, (n: number) => n * 2);
console.log(process(5)); // 12

pipe kontra flow kontra compose

pipe bruker funksjoner på en verdi fra venstre mot høyre, flow bygger en gjenbrukbar funksjon fra venstre mot høyre, og compose bygger en funksjon fra høyre mot venstre. Velg basert på leserekkefølge og behovet for gjenbruk.

Praktiske pipelines

Biblioteker som fp-ts og Effect tilbyr robuste, fullstendig typesatte pipe-funksjoner med mange overloads. Når De bygger en liten variant selv, ser De nøyaktig hvordan typesettingen fungerer.

Hurtigsjekk

En hurtigsjekk av denne leksjonen.

Besvar den i den interaktive leksjonen

Oppsummering

pipe(x, f, g) = g(f(x)) kjøres fra venstre mot høyre og bruker overload-signaturer for å typesette hver aritet presist, med én enkelt reduce-implementasjon. flow er den point-free-varianten som returnerer en gjenbrukbar funksjon.

Gratis å komme i gang

Lær deg TypeScript med en AI-veileder – gratis

Skriv og kjør ekte kode i nettleseren, få umiddelbar hjelp fra en AI-veileder som er tilgjengelig døgnet rundt, og fortsett der du slapp – på nettet eller i appen.

Kurs
101
Leksjoner
352
Start læringen gratisSe hele kurset

Ofte stilte spørsmål

Er leksjonen «Typesatte pipe- og flow-verktøy» gratis?

Ja – hele teksten i «Typesatte pipe- og flow-verktøy» er gratis å lese her på nettet. For å øve interaktivt med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt, og for å låse opp resten av TypeScript Academy-kurset, kan du oppgradere til CoddyKit PRO. Kurset i TypeScript Academy inneholder totalt 4 leksjoner.

Hva lærer jeg i «Typesatte pipe- og flow-verktøy»?

Bygg rørledninger fra venstre mot høyre med nøyaktig inferens. Du øver på TypeScript Academy med praktisk kode som du kjører direkte i nettleseren, mens en AI-veileder som er tilgjengelig døgnet rundt, svarer på spørsmålene dine mens du jobber deg gjennom leksjonen.

Trenger jeg erfaring for å begynne med TypeScript Academy?

Ingen tidligere erfaring er nødvendig. TypeScript Academy på CoddyKit er lagt opp for både nybegynnere og viderekomne, så De kan begynne her eller helt fra start og lære i Deres eget tempo. Dette er leksjon 4 av 4.

Hvor lang tid tar leksjonen «Typesatte pipe- og flow-verktøy»?

De fleste CoddyKit-leksjoner tar omtrent 5–10 minutter. Hver leksjon er kort og interaktiv, slik at De gjør jevne fremskritt og kan fortsette akkurat der De slapp – både på nettet og i appen.

Kan jeg skrive og kjøre kode i denne TypeScript Academy-leksjonen?

Ja. Alle TypeScript Academy-leksjoner har en innebygd kodeeditor, slik at De kan skrive og kjøre ekte kode direkte i nettleseren og få umiddelbar tilbakemelding fra AI – uten lokal konfigurering.

Alle leksjonene i dette kurset

  1. Rene funksjoner og uforanderlighet
  2. Currying og delvis applikasjon
  3. Funksjonskomposisjon med typer
  4. Typesatte pipe- og flow-verktøy
← Tilbake til TypeScript Academy