Tipos intermedios y avanzados en TypeScript
TypeScript ofrece un sistema de tipos sofisticado que va más allá de los tipos básicos como string
, number
o boolean
. Los tipos intermedios y avanzados permiten crear definiciones más precisas y expresivas, mejorando la seguridad del código y proporcionando mejor documentación implícita.
Tipos de unión e intersección
Los tipos de unión permiten que una variable pueda ser de varios tipos diferentes, utilizando el operador |
. Esta característica es especialmente útil cuando una función puede recibir diferentes tipos de parámetros.
type Estado = "cargando" | "completado" | "error";
type Identificador = string | number;
function procesarId(id: Identificador): string {
return `ID: ${id}`;
}
procesarId(123); // ✓ Válido
procesarId("abc-456"); // ✓ Válido
Los tipos de intersección combinan múltiples tipos en uno solo usando el operador &
. El resultado debe cumplir con todas las propiedades de los tipos combinados.
interface Usuario {
nombre: string;
email: string;
}
interface Administrador {
permisos: string[];
nivel: number;
}
type SuperAdmin = Usuario & Administrador;
const admin: SuperAdmin = {
nombre: "Ana García",
email: "ana@empresa.com",
permisos: ["leer", "escribir", "eliminar"],
nivel: 5
};
Tipos literales y plantilla
Los tipos literales restringen los valores a opciones específicas, creando enumeraciones implícitas más flexibles que los enums tradicionales.
type Tema = "claro" | "oscuro" | "automático";
type Puerto = 3000 | 8080 | 9000;
interface Configuracion {
tema: Tema;
puerto: Puerto;
debug: true | false;
}
Los tipos de plantilla literal permiten crear tipos dinámicos basados en patrones de cadenas, combinando literales con tipos existentes.
type Evento = "click" | "hover" | "focus";
type EventHandler = `on${Capitalize<Evento>}`;
// Resultado: "onClick" | "onHover" | "onFocus"
type CSSProperty = `--${string}`;
// Acepta cualquier cadena que comience con "--"
interface ComponenteProps {
[key: CSSProperty]: string;
}
Tipos condicionales y mapeados
Guarda tu progreso
Inicia sesión para no perder tu progreso y accede a miles de tutoriales, ejercicios prácticos y nuestro asistente de IA.
Más de 25.000 desarrolladores ya confían en CertiDevs
Los tipos condicionales utilizan la sintaxis T extends U ? X : Y
para crear tipos que se comportan como operadores ternarios a nivel de tipos.
type EsArray<T> = T extends any[] ? true : false;
type Resultado1 = EsArray<string[]>; // true
type Resultado2 = EsArray<number>; // false
type ExtraerTipo<T> = T extends Promise<infer U> ? U : T;
type TipoPromesa = ExtraerTipo<Promise<string>>; // string
type TipoNormal = ExtraerTipo<number>; // number
Los tipos mapeados transforman las propiedades de un tipo existente aplicando modificaciones sistemáticas.
type Opcional<T> = {
[K in keyof T]?: T[K];
};
type SoloLectura<T> = {
readonly [K in keyof T]: T[K];
};
interface Usuario {
id: number;
nombre: string;
email: string;
}
type UsuarioOpcional = Opcional<Usuario>;
// { id?: number; nombre?: string; email?: string; }
type UsuarioInmutable = SoloLectura<Usuario>;
// { readonly id: number; readonly nombre: string; readonly email: string; }
Tipos utilitarios integrados
TypeScript incluye tipos utilitarios predefinidos que simplifican transformaciones comunes de tipos.
Partial y Required modifican la opcionalidad de las propiedades:
interface Producto {
id: number;
nombre: string;
precio?: number;
}
type ProductoParcial = Partial<Producto>;
// Todas las propiedades son opcionales
type ProductoCompleto = Required<Producto>;
// Todas las propiedades son obligatorias, incluso 'precio'
Pick y Omit seleccionan o excluyen propiedades específicas:
type ProductoBasico = Pick<Producto, "id" | "nombre">;
// { id: number; nombre: string; }
type ProductoSinId = Omit<Producto, "id">;
// { nombre: string; precio?: number; }
Record crea tipos de objeto con claves y valores específicos:
type EstadisticasVentas = Record<string, number>;
// { [key: string]: number; }
type ConfiguracionModulos = Record<"auth" | "database" | "cache", boolean>;
// { auth: boolean; database: boolean; cache: boolean; }
Inferencia avanzada con infer
La palabra clave infer permite extraer tipos de estructuras complejas dentro de tipos condicionales, creando tipos más dinámicos y reutilizables.
type ParametrosFuncion<T> = T extends (...args: infer P) => any ? P : never;
type RetornoFuncion<T> = T extends (...args: any[]) => infer R ? R : never;
function calcular(a: number, b: string): boolean {
return a > parseInt(b);
}
type Parametros = ParametrosFuncion<typeof calcular>;
// [number, string]
type Retorno = RetornoFuncion<typeof calcular>;
// boolean
Esta capacidad de inferencia es fundamental para crear bibliotecas y frameworks que se adapten automáticamente a los tipos que reciben, proporcionando una experiencia de desarrollo más fluida y type-safe.
Los tipos intermedios y avanzados de TypeScript transforman la manera de pensar sobre la tipificación estática, permitiendo expresar relaciones complejas entre datos de forma clara y mantenible.
Completa TypeScript y certifícate
Únete a nuestra plataforma y accede a miles de tutoriales, ejercicios prácticos, proyectos reales y nuestro asistente de IA personalizado para acelerar tu aprendizaje.
Asistente IA
Resuelve dudas al instante
Ejercicios
Practica con proyectos reales
Certificados
Valida tus conocimientos
Más de 25.000 desarrolladores ya se han certificado con CertiDevs