TypeScript Academy · Lekcja

Typowane narzędzia pipe i flow

Buduj potoki od lewej do prawej z dokładnym wnioskowaniem typów

Typowane narzędzia pipe i flow 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.

Od compose do pipe

pipe przekazuje wartość przez funkcje od lewej do prawej, czyli w kolejności, w jakiej większość osób woli czytać. pipe(x, f, g) oznacza g(f(x)).

Pipe z dwoma krokami

Najprostszy pipe przyjmuje wartość i jedną funkcję, a następnie zwraca wynik. Czytanie od góry do dołu odpowiada kolejności wykonywania.

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

Przekazywanie przez kilka funkcji

Pipe przyjmujący trzy argumenty stosuje funkcje po kolei. Wynik każdego kroku staje się danymi wejściowymi następnego.

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

Czytanie od lewej do prawej

W przeciwieństwie do compose, pipe wymienia kroki w kolejności ich wykonywania. pipe(5, inc, dbl) najpierw zwiększa wartość, a następnie ją podwaja — dokładnie tak, jak zapisano.

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

Dlaczego potrzebne są przeciążenia

Różne miejsca wywołania przekazują różną liczbę funkcji. Aby precyzyjnie typować każdą liczbę argumentów, pipe używa sygnatur przeciążenia — po jednej dla każdej obsługiwanej długości.

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);
}

Każde przeciążenie łączy typy

Przeciążenie dla dwóch funkcji łączy typy A -> B, a przeciążenie dla trzech funkcji łączy typy A -> B -> C. Kompilator wybiera pasujące przeciążenie na podstawie liczby przekazanych funkcji.

Implementacja wykonywana w czasie działania

Pod przeciążeniami znajduje się pojedyncze wywołanie reduce, które stosuje każdą funkcję po kolei. Sygnatura implementacji używa luźnych typów, natomiast osoby wywołujące funkcję widzą precyzyjne przeciążenia.

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

Zmiany typów w potoku

Ponieważ każde przeciążenie łączy generyki, pipe może przekształcać wartość między wieloma typami, zachowując pełne sprawdzanie typów.

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

flow: pipe bez wartości

flow działa podobnie jak pipe, ale przyjmuje tylko funkcje i zwraca nową funkcję. Wartość jest dostarczana później, co świetnie sprawdza się przy ponownym użyciu.

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 vs flow vs compose

pipe stosuje funkcje do wartości od lewej do prawej; flow tworzy wielokrotnie używaną funkcję działającą od lewej do prawej; compose tworzy funkcję działającą od prawej do lewej. Należy wybrać rozwiązanie zależnie od preferowanej kolejności czytania i możliwości ponownego użycia.

Praktyczne potoki

Biblioteki takie jak fp-ts i Effect udostępniają solidny, w pełni typowany pipe z wieloma przeciążeniami. Samodzielne zbudowanie niewielkiej wersji pokazuje dokładnie, jak działa typowanie.

Szybkie sprawdzenie

Szybkie sprawdzenie tej lekcji.

Podsumowanie

pipe(x, f, g) = g(f(x)) działa od lewej do prawej i używa sygnatur przeciążenia do precyzyjnego typowania każdej liczby argumentów, korzystając z pojedynczej implementacji reduce. flow to wariant point-free zwracający funkcję wielokrotnego użytku.

Często zadawane pytania

Czy lekcja „Typowane narzędzia pipe i flow” jest bezpłatna?

Tak — pełny tekst „Typowane narzędzia pipe i flow” 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 „Typowane narzędzia pipe i flow”?

Buduj potoki od lewej do prawej z dokładnym wnioskowaniem typów Ć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 „Typowane narzędzia pipe i flow”?

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