Los tipos condicionales en TypeScript son una característica avanzada que permite definir tipos basados en una condición. Esto es similar a las declaraciones if en el código, pero se aplica a los tipos. Los tipos condicionales son útiles para crear tipos más flexibles y reutilizables.
Sintaxis Básica
La sintaxis básica de un tipo condicional es la siguiente:
Aquí, T es el tipo que estamos evaluando, U es el tipo contra el que estamos comparando, X es el tipo que se devuelve si T extiende U, y Y es el tipo que se devuelve si T no extiende U.
Ejemplo Básico
Veamos un ejemplo simple para entender cómo funcionan los tipos condicionales:
type IsString<T> = T extends string ? "Yes" : "No"; type A = IsString<string>; // "Yes" type B = IsString<number>; // "No"
En este ejemplo, IsString es un tipo condicional que verifica si T es un string. Si T es un string, el tipo resultante es "Yes", de lo contrario, es "No".
Uso de Tipos Condicionales
Filtrado de Tipos
Los tipos condicionales pueden ser utilizados para filtrar tipos dentro de una unión:
type Filter<T, U> = T extends U ? T : never; type Numbers = Filter<string | number | boolean, number>; // number
En este ejemplo, Filter toma dos tipos T y U. Si T extiende U, el tipo resultante es T, de lo contrario, es never. Esto se puede usar para filtrar tipos específicos de una unión.
Inferencia de Tipos
Los tipos condicionales también pueden inferir tipos usando la palabra clave infer:
type GetReturnType<T> = T extends (...args: any[]) => infer R ? R : never; type Func = () => string; type ReturnTypeOfFunc = GetReturnType<Func>; // string
En este ejemplo, GetReturnType toma un tipo T y verifica si es una función. Si es una función, infiere el tipo de retorno R y lo devuelve. Si no es una función, devuelve never.
Ejercicios Prácticos
Ejercicio 1: Filtrar Tipos
Crea un tipo condicional llamado ExtractString que filtre los tipos string de una unión de tipos.
type ExtractString<T> = T extends string ? T : never; type Test1 = ExtractString<string | number | boolean>; // string type Test2 = ExtractString<number | boolean>; // never
Ejercicio 2: Inferir Tipos de Parámetros
Crea un tipo condicional llamado GetFirstParameterType que infiera el tipo del primer parámetro de una función.
type GetFirstParameterType<T> = T extends (arg1: infer P, ...args: any[]) => any ? P : never; type Func1 = (x: number, y: string) => void; type ParamType1 = GetFirstParameterType<Func1>; // number type Func2 = (x: boolean) => void; type ParamType2 = GetFirstParameterType<Func2>; // boolean
Resumen
Los tipos condicionales en TypeScript son una herramienta poderosa para crear tipos dinámicos y flexibles. Permiten definir tipos basados en condiciones, filtrar tipos dentro de una unión e inferir tipos de parámetros y retornos de funciones. Con la práctica, los tipos condicionales pueden mejorar significativamente la capacidad de tipado y la flexibilidad de tu código TypeScript.
En el siguiente módulo, exploraremos más sobre funciones y módulos, donde aprenderemos a definir tipos de función, trabajar con parámetros opcionales y predeterminados, y mucho más.
Curso de TypeScript
Módulo 1: Introducción a TypeScript
- ¿Qué es TypeScript?
- Configuración del Entorno de TypeScript
- Tipos Básicos
- Anotaciones de Tipo
- Compilando TypeScript
Módulo 2: Trabajando con Tipos
Módulo 3: Tipos Avanzados
Módulo 4: Funciones y Módulos
- Tipos de Función
- Parámetros Opcionales y Predeterminados
- Parámetros Rest
- Módulos y Espacios de Nombres
- Decoradores
Módulo 5: Programación Asíncrona
Módulo 6: Herramientas y Mejores Prácticas
- Linting y Formateo
- Pruebas de Código TypeScript
- TypeScript con Webpack
- TypeScript con React
- Mejores Prácticas