0Pricing
TypeScript Academy · Lección

Tipos condicionales distributivos

Controle cómo se distribuyen los condicionales sobre las uniones.

Tipos condicionales distributivos 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.

Un comportamiento sorprendente

Los tipos condicionales tienen una regla especial: cuando el tipo comprobado es un parámetro de tipo desnudo y se pasa una unión, el condicional se distribuye por separado sobre cada elemento y después une los resultados.

Esta es la base de Exclude, Extract y muchas otras utilidades.

type ToArray<T> = T extends unknown ? T[] : never;

type A = ToArray<string | number>;
// string[] | number[]  (NOT (string | number)[])

Qué significa «desnudo»

«Desnudo» significa que el parámetro de tipo aparece por sí solo a la izquierda de extends, sin estar envuelto en otro tipo. La distribución solo ocurre con parámetros desnudos.

type Naked<T> = T extends string ? "y" : "n";
// T is naked -> distributes over unions

La distribución paso a paso

Para ToArray<string | number>, el compilador evalúa cada elemento:

  • ToArray<string> = string[]
  • ToArray<number> = number[]

Después los une: string[] | number[].

type R = ToArray<boolean>;
// boolean is true | false, so:
// true[] | false[]

Filtrar una unión

La distribución facilita el filtrado. Convierta los elementos no deseados en never; never desaparece de una unión y solo quedan los elementos conservados.

type Strings<T> = T extends string ? T : never;

type A = Strings<string | number | boolean>; // string

never desaparece en las uniones

Un dato clave: X | never se simplifica a X. Por tanto, cuando una rama distribuida produce never, ese elemento se elimina efectivamente de la unión final.

type A = string | never;        // string
type B = "a" | never | "b";     // "a" | "b"

Desactivar la distribución

A veces no quiere aplicar la distribución, por ejemplo, al comparar una unión completa como una sola unidad. Envuelva ambos lados en una tupla de un elemento: [T] extends [U]. Ahora T ya no está desnudo, por lo que la distribución queda desactivada.

type IsNever<T> = [T] extends [never] ? true : false;

type A = IsNever<never>;  // true
type B = IsNever<string>; // false

Por qué funciona el envoltorio

Al colocar [T] a la izquierda, el tipo comprobado es una tupla, no el parámetro sin envolver. La regla especial de distribución deja de aplicarse, así que la unión se comprueba como un todo.

type AllStrings<T> = [T] extends [string] ? true : false;

type A = AllStrings<"a" | "b">;     // true
type B = AllStrings<"a" | number>;  // false

Distribuido frente a no distribuido

Compare directamente las dos formas. La versión desnuda comprueba cada elemento; la versión envuelta comprueba la unión como un solo tipo.

type Distributed<T> = T extends string ? true : false;
type Wrapped<T> = [T] extends [string] ? true : false;

type A = Distributed<string | number>; // boolean (true | false)
type B = Wrapped<string | number>;     // false

Interioridades de Exclude

La utilidad integrada Exclude<T, U> elimina de T cualquier elemento asignable a U. No es más que un condicional distributivo que convierte los elementos coincidentes en never.

type MyExclude<T, U> = T extends U ? never : T;

type A = MyExclude<"a" | "b" | "c", "b">; // "a" | "c"

Interioridades de Extract

Extract<T, U> es la imagen especular: conserva solo los elementos asignables a U. La misma distribución, con ramas opuestas.

type MyExtract<T, U> = T extends U ? T : never;

type A = MyExtract<"a" | "b" | "c", "a" | "c">; // "a" | "c"

Potencia práctica

La distribución permite transformar cada elemento de una unión en una sola expresión: construir matrices de cada uno, anteponer un prefijo a cada cadena o filtrar por estructura. Al combinarla con [T] extends [U] para realizar comprobaciones de la unión completa, controla exactamente cuándo se activa la distribución.

Notación: en TypeScript real, los tipos literales de plantilla se escriben con cadenas delimitadas por comillas invertidas que contienen marcadores dollar-brace. En estos fragmentos mostramos ese patrón como Tpl<...>, enumerando cada parte en orden; por ejemplo, una plantilla con comillas invertidas que coincide con el prefijo literal seguido de Rest aparece como Tpl<'prefix', infer Rest>.

type Prefix<T extends string> = T extends unknown ? Tpl<'id_', T> : never;
// Tpl<'id_', T> is the template literal type joining 'id_' with each T

type A = Prefix<'a' | 'b'>; // 'id_a' | 'id_b'

Comprobación rápida

Compruebe cuánto entiende de los condicionales distributivos.

Resumen

Los tipos condicionales distributivos son el motor de las utilidades para uniones.

  • Un T extends U ? desnudo se distribuye sobre cada elemento de la unión.
  • Las ramas que devuelven never filtran los elementos.
  • [T] extends [U] desactiva la distribución para comprobar la unión completa.
  • Exclude y Extract son pequeños condicionales distributivos.

A continuación, en el curso 22: aritmética en el sistema de tipos.

Preguntas frecuentes

¿La lección «Tipos condicionales distributivos» es gratis?

Sí — el texto completo de «Tipos condicionales distributivos» 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 «Tipos condicionales distributivos»?

Controle cómo se distribuyen los condicionales sobre las uniones. 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 «Tipos condicionales distributivos»?

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

  1. Los tipos como lenguaje de computación
  2. Condicionales a nivel de tipos
  3. Recursión a nivel de tipos
  4. Tipos condicionales distributivos
← Volver a TypeScript Academy