Patrones prácticos con satisfies
Aplique satisfies a objetos de configuración y tablas de consulta.
Patrones prácticos con satisfies es una lección gratuita de TypeScript Academy en CoddyKit. Esta es la lección 4 de 4. 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 4 lecciones en total.
Validar una paleta de colores
Un patrón habitual para una paleta es satisfies Record<string, Color>: se comprueba que cada valor sea un color válido, mientras las claves permanecen exactas para el autocompletado.
type Color = "red" | "green" | "blue";
const palette = {
primary: "blue",
secondary: "green"
} satisfies Record<string, Color>;
console.log(palette.primary);Detectar valores de paleta no válidos
Si un valor no es un Color válido, satisfies informa de un error, mientras las claves conservan sus tipos precisos.
type Color = "red" | "green" | "blue";
// const bad = { primary: "purple" } satisfies Record<string, Color>; // Error
const ok = { primary: "red" } satisfies Record<string, Color>;
console.log(ok.primary);Conservar el autocompletado de las claves
Como las claves inferidas son "primary" | "secondary", el editor las completa automáticamente, a diferencia de una anotación Record simple, que perdería las claves específicas.
type Color = "red" | "green" | "blue";
const palette = { primary: "red", accent: "blue" } satisfies Record<string, Color>;
// palette.<autocomplete: primary, accent>
console.log(palette.accent);Validar un mapa de rutas
Los mapas de rutas también se benefician: los valores deben coincidir con la estructura de un controlador, mientras los nombres de las rutas permanecen disponibles para las funciones auxiliares de navegación.
type Route = { method: "GET" | "POST"; path: string };
const routes = {
home: { method: "GET", path: "/" },
login: { method: "POST", path: "/login" }
} satisfies Record<string, Route>;
console.log(routes.login.method);Indexar el mapa
Al conservar las claves, puede crear un tipo con los nombres de rutas válidos e indexar el tipo del mapa de forma segura.
type Route = { method: string; path: string };
const routes = {
home: { method: "GET", path: "/" },
about: { method: "GET", path: "/about" }
} satisfies Record<string, Route>;
type RouteName = keyof typeof routes; // "home" | "about"
const pick: RouteName = "about";
console.log(routes[pick].path);Configuración tipada con valores heterogéneos
satisfies también funciona cuando los valores tienen estructuras diferentes. Restrinja el conjunto mediante un tipo unión y cada valor se validará respecto de él.
type Setting = number | boolean | string;
const config = {
retries: 3,
verbose: true,
region: "eu"
} satisfies Record<string, Setting>;
console.log(config.retries, config.verbose);Tablas de consulta similares a un enum
Construya una tabla de consulta validada respecto de un tipo de valor, conservando cada entrada exacta para utilizarla posteriormente.
type Status = "active" | "inactive";
const userStatus = {
alice: "active",
bob: "inactive"
} satisfies Record<string, Status>;
const s: "active" = userStatus.alice;
console.log(s);Combinar con as const
Combine as const y satisfies para obtener datos profundamente inmutables y validados: as const los congela y satisfies los comprueba.
type Color = "red" | "blue";
const theme = {
primary: "red",
secondary: "blue"
} as const satisfies Record<string, Color>;
console.log(theme.primary);Validar rangos numéricos mediante tipos
Puede restringir los valores a una unión de literales numéricos para representar conjuntos fijos de opciones, validados en el momento de la definición.
type Level = 1 | 2 | 3;
const levels = {
easy: 1,
medium: 2,
hard: 3
} satisfies Record<string, Level>;
console.log(levels.hard);Un mapa de indicadores de funcionalidades
Una configuración práctica de indicadores de funcionalidades: las claves son nombres de indicadores que puede completar automáticamente y los valores son booleanos validados por satisfies.
const flags = {
newDashboard: true,
betaSearch: false
} satisfies Record<string, boolean>;
type Flag = keyof typeof flags;
const f: Flag = "betaSearch";
console.log(flags[f]);Por qué este patrón es superior
En paletas, rutas e indicadores, satisfies Record<...> proporciona valores validados y claves y literales precisos: el punto óptimo para las configuraciones tipadas de uso cotidiano.
type Color = "red" | "green" | "blue";
const ui = { brand: "green", warn: "red" } satisfies Record<string, Color>;
console.log(Object.keys(ui).join(","));Comprobación rápida: satisfies en la práctica
Compruebe que entiende los patrones prácticos de satisfies.
Resumen: patrones prácticos de satisfies
Ha aplicado satisfies Record<string, Color> a paletas, mapas de rutas, indicadores y tablas de consulta, conservando las claves y los literales exactos para el autocompletado y validando cada valor.
type Color = "red" | "blue";
const theme = { bg: "blue", fg: "red" } satisfies Record<string, Color>;
console.log(theme.bg, theme.fg);Preguntas frecuentes
¿La lección «Patrones prácticos con satisfies» es gratis?
Sí — el texto completo de «Patrones prácticos con satisfies» 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 4 lecciones en total.
¿Qué aprenderé en «Patrones prácticos con satisfies»?
Aplique satisfies a objetos de configuración y tablas de consulta. 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 4 de 4.
¿Cuánto tiempo toma la lección «Patrones prácticos con satisfies»?
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
- Por qué existe satisfies
- satisfies frente a la anotación de tipos
- satisfies frente a la aserción as
- Patrones prácticos con satisfies