Tipos intermedios y avanzados

TypeScript
TypeScript
Actualizado: 30/06/2025

¡Desbloquea el curso completo!

IA
Ejercicios
Certificado
Entrar

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.

Progreso guardado
Asistente IA
Ejercicios
Iniciar sesión gratis

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

⭐⭐⭐⭐⭐
4.9/5 valoración