T extends U ? X : Y en la práctica
Escriba tipos condicionales prácticos; aprenda cómo se distribuyen sobre uniones y cómo evitarlo cuando sea necesario.
T extends U ? X : Y en la práctica es una lección gratuita de TypeScript Academy en CoddyKit. Esta es la lección 1 de 3. 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 3 lecciones en total.
Introducción
Objetivo: Utilice tipos condicionales para expresar lógica en el sistema de tipos y comprenda cuándo se distribuyen sobre uniones.
- Patrón:
T extends U ? X : Y - Distribución: aplica una rama por cada miembro de la unión
Patrón básico
Los tipos condicionales eligen una rama según si T se puede asignar a string.
type IsString<T> = T extends string ? true : false
type A = IsString<string>
// ^ true
type B = IsString<number>
// ^ falseDistribución
Con una T independiente, la comprobación se ejecuta para cada miembro de la unión: string | number se convierte en string[] | number[].
type ToArray<T> = T extends any ? T[] : never
type C = ToArray<string | number>
// distributes:
// C is string[] | number[]Desactivar la distribución
Envuelva T en una tupla ([T]) para impedir la distribución y tratar la unión como un todo.
type ToArrayNoDist<T> = [T] extends [any] ? T[] : never
type D = ToArrayNoDist<string | number>
// no distribution:
// D is (string | number)[]Utilidad práctica
Ejemplo del patrón: para las matrices, ElementType utiliza infer para extraer el elemento; de lo contrario, deja el tipo tal como está.
type NonEmptyArray<T> = T[] extends [] ? never : T[]
// Usually better:
// type ElementType<T> = T extends ReadonlyArray<infer U> ? U : T
type E1 = ElementType<string[]>
// ^ string
type E2 = ElementType<readonly number[]>
// ^ number
type E3 = ElementType<string>
// ^ stringConsejos
Consejos: Mantenga sencillas las condiciones; tenga en cuenta el despliegue; reutilice los tipos auxiliares; incluya archivos de prueba para las combinaciones complejas.
// Tips
// - Keep conditions simple; deep nesting harms readability
// - Document distribution behavior for teammates
// - Prefer helper aliases (ElementType, Awaited) for reuse
// - Watch for De Morgan like logic when composing unionsComprobación de la distribución
Comprobación rápida: ¿Cuándo se distribuyen los tipos condicionales?
Repaso
Repaso: Los tipos condicionales modelan la lógica en los tipos. La distribución se aplica a cada miembro de la unión; utilice una envoltura de tupla para desactivarla.
Preguntas frecuentes
¿La lección «T extends U ? X : Y en la práctica» es gratis?
Sí — el texto completo de «T extends U ? X : Y en la práctica» 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 3 lecciones en total.
¿Qué aprenderé en «T extends U ? X : Y en la práctica»?
Escriba tipos condicionales prácticos; aprenda cómo se distribuyen sobre uniones y cómo evitarlo cuando sea necesario. 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 1 de 3.
¿Cuánto tiempo toma la lección «T extends U ? X : Y en la práctica»?
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
- T extends U ? X : Y en la práctica
- infer para utilidades similares a ReturnType
- Tipos integrados: ReturnType, Parameters, InstanceType, etc.