TypeScript Academy · Lección

Utilidades pipe y flow tipadas

Cree pipelines de izquierda a derecha con inferencia precisa.

Utilidades pipe y flow tipadas es una lección gratuita de TypeScript Academy en CoddyKit. Esta es la lección 4 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de TypeScript Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de TypeScript Academy incluye 4 lecciones en total.

De compose a pipe

pipe pasa un valor por las funciones de izquierda a derecha, el orden de lectura que prefiere la mayoría de las personas. pipe(x, f, g) significa g(f(x)).

Un pipe de dos pasos

El pipe más sencillo recibe un valor y una función, y devuelve el resultado. Leerlo de arriba abajo coincide con el orden de ejecución.

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

Pasar un valor por varias funciones

Un pipe de tres argumentos aplica las funciones en secuencia. La salida de cada paso se convierte en la entrada del siguiente.

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

Lectura de izquierda a derecha

A diferencia de compose, pipe enumera los pasos en el orden en que se ejecutan. pipe(5, inc, dbl) incrementa y después duplica, exactamente como está escrito.

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

Por qué se necesitan sobrecargas

En distintos puntos de llamada se pasan cantidades diferentes de funciones. Para tipar cada aridad con precisión, pipe utiliza firmas de sobrecarga, una por cada longitud admitida.

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

Cada sobrecarga encadena los tipos

La sobrecarga de dos funciones encadena A -> B; la de tres encadena A -> B -> C. El compilador elige la sobrecarga correspondiente según el número de funciones que pase.

La implementación en tiempo de ejecución

Debajo de las sobrecargas, un único reduce aplica todas las funciones por turnos. La firma de implementación utiliza tipos poco restrictivos; quienes llaman a la función ven las sobrecargas precisas.

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

Cambios de tipo a lo largo del pipe

Como cada sobrecarga encadena genéricos, un pipe puede transformar un valor entre varios tipos y mantener al mismo tiempo una comprobación de tipos completa.

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

flow: pipe sin el valor

flow es similar a pipe, pero solo recibe las funciones y devuelve una función nueva. Puede proporcionar el valor más adelante, lo que resulta ideal para reutilizarla.

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 frente a flow y compose

pipe aplica funciones a un valor de izquierda a derecha; flow crea una función reutilizable de izquierda a derecha; compose crea una función de derecha a izquierda. Elija según el orden de lectura y la posibilidad de reutilización.

Canalizaciones prácticas

Bibliotecas como fp-ts y Effect ofrecen un pipe sólido y completamente tipado, con muchas sobrecargas. Crear uno pequeño por su cuenta muestra exactamente cómo funciona el tipado.

Comprobación rápida

Comprobación rápida de esta lección.

Resumen

pipe(x, f, g) = g(f(x)) se ejecuta de izquierda a derecha y utiliza firmas de sobrecarga para tipar cada aridad con precisión, con una única implementación basada en reduce. flow es la variante sin punto que devuelve una función reutilizable.

Preguntas frecuentes

¿La lección «Utilidades pipe y flow tipadas» es gratis?

Sí — el texto completo de «Utilidades pipe y flow tipadas» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de TypeScript Academy, actualiza a CoddyKit PRO. El curso de TypeScript Academy incluye 4 lecciones en total.

¿Qué aprenderé en «Utilidades pipe y flow tipadas»?

Cree pipelines de izquierda a derecha con inferencia precisa. Practicas TypeScript Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.

¿Necesito experiencia previa para empezar TypeScript Academy?

No se requiere experiencia previa. TypeScript Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 4 de 4.

¿Cuánto tiempo toma la lección «Utilidades pipe y flow tipadas»?

La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.

¿Puedo escribir y ejecutar código en esta lección de TypeScript Academy?

Sí. Cada lección de TypeScript Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.

Todas las lecciones de este curso

← Volver a TypeScript Academy