0Pricing
TypeScript Academy · 课时

带类型的 pipe 与 flow 工具

构建从左到右执行且推断准确的流水线。

带类型的 pipe 与 flow 工具 是 CoddyKit 上的免费 TypeScript Academy 课时。 这是第 4 节课，共 4 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 TypeScript Academy 学习路径的一部分，你的进度在网页和 CoddyKit 应用中同步。 TypeScript Academy 课程共包含 4 节课。

从 compose 到管道

管道会按从左向右的顺序让值依次经过各个函数，这是大多数人偏好的阅读顺序。pipe(x, f, g) 表示 g(f(x))。

两步管道

最简单的管道接收一个值和一个函数，并返回结果。从上到下阅读时，顺序正好与执行顺序一致。

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

依次经过多个函数

三参数管道会按顺序应用各个函数。每一步的输出都会成为下一步的输入。

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

从左向右阅读

与 compose 不同，pipe 会按照函数运行的顺序列出各个步骤。pipe(5, inc, dbl) 会先加一，再加倍，完全符合代码的书写顺序。

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

为何需要重载

不同的调用位置会传入不同数量的函数。为了精确地为每种参数数量添加类型，pipe 使用重载签名，每种受支持的长度对应一个签名。

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

每个重载都会串联类型

两个参数的重载串联 A -> B；三个参数的重载串联 A -> B -> C。编译器会根据您传入的函数数量选择匹配的重载。

运行时实现

在这些重载之下，单个 reduce 会依次应用每个函数。实现签名使用宽泛类型，而调用者看到的是精确的重载。

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

沿管道改变类型

由于每个重载都会串联泛型，管道可以让一个值经过多种类型的转换，同时始终接受完整的类型检查。

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

flow：不携带值的管道

flow 类似于管道，但只接收函数并返回一个新函数。您可以稍后再提供值，这非常适合复用。

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

管道、flow 与 compose

pipe 按从左向右的顺序将函数应用于一个值；flow 构建一个可复用的从左向右函数；compose 构建一个从右向左的函数。请根据阅读顺序和复用需求进行选择。

实用管道

像 fp-ts 和 Effect 这样的库提供了带有许多重载、健壮且类型完整的 pipe。亲自构建一个小型版本，可以准确展示类型检查的工作方式。

快速检查

快速检查本课内容。

回顾

pipe(x, f, g) = g(f(x)) 按从左向右的顺序运行，并使用重载签名为每种参数数量精确添加类型，同时只需一个 reduce 实现。flow 是返回可复用函数的无点变体。

常见问题解答

「带类型的 pipe 与 flow 工具」课时是免费的吗？

是的 — 「带类型的 pipe 与 flow 工具」的完整文本可在网页上免费阅读。要进行交互式练习（内置代码编辑器和全天候 AI 导师）并解锁 TypeScript Academy 课程的其余内容，请升级到 CoddyKit PRO。 TypeScript Academy 课程共包含 4 节课。

「带类型的 pipe 与 flow 工具」这节课中我会学到什么？

构建从左到右执行且推断准确的流水线。 你通过在浏览器中直接运行的动手代码来练习 TypeScript Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。

学习 TypeScript Academy 需要有经验吗？

无需任何先前经验。CoddyKit 上的 TypeScript Academy 课程适合初学者到高级学习者，你可以从这里开始或从头开始，按照自己的节奏学习。 这是第 4 节课，共 4 节。

「带类型的 pipe 与 flow 工具」课时需要多长时间？

大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动，所以你能稳步进步，并在网页和应用中从离开的地方继续。

我能在这节 TypeScript Academy 课中编写并运行代码吗？

能。每节 TypeScript Academy 课都包含内置代码编辑器，你可以在浏览器中直接编写并运行真实代码，并获得即时 AI 反馈 — 无需本地设置。

此课程中的所有课时

  1. 纯函数与不可变性
  2. 柯里化与部分应用
  3. 使用类型进行函数组合
  4. 带类型的 pipe 与 flow 工具
← 返回 TypeScript Academy