Cheatsheet de TypeScript: Tipos, Interfaces, Genéricos y Tipos Utilitarios

Referencia de TypeScript para código real: tipos primitivos y uniones, interfaces frente a alias de tipos, genéricos con restricciones y los tipos utilitarios que sí vas a usar.

🧪

Ejecuta y Edita este Código en Vivo Sin instalaciones locales. Soporta Python 3, JS y SQL.

▶ Probar en Playground →

1. Tipos básicos y anotaciones

Anota las fronteras de las funciones y deja que la inferencia haga el resto. Importan sobre todo tres tipos especiales: unknown obliga a comprobar antes de usar, any desactiva la comprobación por completo y never significa «esto no puede pasar».

CODE SNIPPET

let name: string = "Ana";
let scores: number[] = [10, 20];
let pair: [string, number] = ["id", 42];        // tupla
let status: "idle" | "loading" | "done" = "idle"; // unión de literales
let data: unknown;      // seguro: hay que acotar antes de usar
let anything: any;      // vía de escape: sin comprobación

function greet(user: string, loud = false): string {
  return loud ? `HELLO ${user}` : `Hello ${user}`;
}

// Narrowing: comprobaciones que refinan una unión
function printId(id: string | number) {
  if (typeof id === "string") return id.toUpperCase();
  return id.toFixed(0);
}

2. Interfaces y alias de tipos

Las interfaces describen la forma de los objetos y pueden extenderse y fusionarse; los alias de tipos cubren uniones, tuplas y tipos calculados. Para formas de objeto públicas, interface es la opción habitual.

CODE SNIPPET

interface User {
  id: number;
  email: string;
  nickname?: string;          // propiedad opcional
  readonly createdAt: Date;   // se asigna una vez, nunca se reasigna
}

interface Admin extends User {
  permissions: string[];
}

type Result<T> = { ok: true; value: T } | { ok: false; error: string };
type ID = string | number;

const u: User = { id: 1, email: "[email protected]", createdAt: new Date() };

3. Genéricos: código reutilizable y seguro

Un genérico captura la relación de tipos entre entradas y salidas en vez de fijar un solo tipo. Las restricciones (extends) prometen justo la estructura que el cuerpo necesita.

CODE SNIPPET

// Una función, cualquier tipo de elemento
function first<T>(items: T[]): T | undefined {
  return items[0];
}
const n = first([1, 2, 3]);        // number | undefined
const s = first(["a", "b"]);       // string | undefined

// Restricción: T debe tener al menos length
function longest<T extends { length: number }>(a: T, b: T): T {
  return a.length >= b.length ? a : b;
}

// keyof: claves de un tipo, para acceso seguro a propiedades
function getProp<T, K extends keyof T>(obj: T, key: K): T[K] {
  return obj[key];
}

4. Tipos utilitarios que sí vas a usar

Estas utilidades integradas transforman tipos existentes en vez de duplicarlos. Por dentro son genéricos y aparecen en casi cualquier base de código en producción.

Utilidad	Transforma	Uso típico
`Partial<T>`	Toda propiedad pasa a ser opcional	Payloads de actualización
`Required<T>`	Toda propiedad pasa a ser obligatoria	Objetos de configuración completos
`Pick<T, K>`	Conserva solo las claves indicadas	DTOs y respuestas de API
`Omit<T, K>`	Elimina las claves indicadas	Payloads de creación sin id
`Record<K, V>`	Objeto con claves K y valores V	Diccionarios y tablas de búsqueda
`ReturnType<fn>`	El tipo de retorno de un tipo función	Tipar resultados derivados
`Awaited<T>`	Desenvuelve una Promise a su tipo resuelto	Resultados de funciones async
`NonNullable<T>`	Elimina null y undefined	Después de una guarda o un filtro