satisfies frente a la anotación de tipos
Conserve la inferencia de literales y valide al mismo tiempo la estructura.
satisfies frente a la anotación de tipos es una lección gratuita de TypeScript Academy en CoddyKit. Esta es la lección 2 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.
El patrón de anotación
El patrón clásico const config: Type = {...} valida el objeto, pero el tipo de la variable se convierte en Type, lo que ensancha cualquier literal incluido.
type Config = { mode: string; level: number };
const config: Config = { mode: "dark", level: 5 };
// config.mode has type string
console.log(config.mode);Cómo se ve el ensanchamiento
Con la anotación, config.mode es string. No puede asignarlo a una variable que espere el literal "dark".
type Config = { mode: string };
const config: Config = { mode: "dark" };
// const m: "dark" = config.mode; // Error: string not assignable to "dark"
console.log(config.mode);El patrón satisfies
Con const config = {...} satisfies Type, la variable conserva su tipo inferido exacto y, al mismo tiempo, se comprueba respecto de Type.
type Config = { mode: string; level: number };
const config = { mode: "dark", level: 5 } satisfies Config;
// config.mode has type "dark"
console.log(config.mode);Se conserva la inferencia exacta
Ahora config.mode es el literal "dark", por lo que funciona en cualquier lugar donde se requiera el tipo estrecho.
type Config = { mode: string };
const config = { mode: "dark" } satisfies Config;
const m: "dark" = config.mode; // OK
console.log(m);Ambos siguen validando
Ambos patrones rechazan los objetos no válidos. La diferencia está únicamente en el tipo resultante de la variable, no en si se realiza la validación.
type Config = { level: number };
// const a: Config = { level: "x" }; // Error
// const b = { level: "x" } satisfies Config; // Error
const ok = { level: 3 } satisfies Config;
console.log(ok.level);Se detectan las propiedades adicionales
Al igual que las anotaciones, satisfies señala las propiedades adicionales que no están en el tipo de destino, lo que ayuda a detectar errores tipográficos en las claves.
type Config = { mode: string };
// const c = { mode: "dark", extar: true } satisfies Config; // Error: extar
const c = { mode: "dark" } satisfies Config;
console.log(c.mode);Conservar la naturaleza de tupla
satisfies también ayuda a que los arrays conserven una precisión similar a la de una tupla cuando se combina con as const, sin dejar de validar los tipos de sus elementos.
type Nums = readonly number[];
const xs = [1, 2, 3] as const satisfies Nums;
// xs is a readonly tuple [1, 2, 3], validated as numbers
console.log(xs.length);La anotación ensancha los miembros de una unión
Si un campo es una unión como "a" | "b", una anotación con el tipo de unión lo mantiene como unión, pero un tipo de campo más amplio lo ensancha. satisfies fija el miembro exacto.
type Config = { tier: string };
const withAnn: Config = { tier: "pro" }; // tier: string
const withSat = { tier: "pro" } satisfies Config; // tier: "pro"
console.log(withAnn.tier, withSat.tier);Conservar el autocompletado al leer
Como satisfies conserva las claves y los valores literales, los editores pueden ofrecer autocompletado basándose en el objeto exacto, no en el tipo declarado más amplio.
type Theme = Record<string, string>;
const theme = { bg: "black", fg: "white" } satisfies Theme;
// theme.<autocomplete shows bg and fg>
console.log(theme.bg, theme.fg);Cómo elegir entre ambos
Use una anotación simple cuando realmente quiera el tipo más amplio. Use satisfies cuando quiera validación, pero también necesite conservar después la estructura inferida precisa.
type Config = { mode: string };
// Want wide type for reassignment flexibility -> annotation
let a: Config = { mode: "dark" };
// Want exact literals for later indexing -> satisfies
const b = { mode: "dark" } satisfies Config;
console.log(a.mode, b.mode);Resumen comparativo
La anotación ensancha; satisfies conserva. Ambos validan. Para las configuraciones inmutables que solo va a leer, satisfies suele ser la mejor opción predeterminada.
type C = { color: string; size: number };
const widened: C = { color: "red", size: 1 };
const exact = { color: "red", size: 1 } satisfies C;
console.log(widened.color, exact.color);Comprobación rápida: satisfies frente a una anotación
Compruebe que entiende la diferencia.
Resumen: satisfies frente a una anotación de tipo
Una anotación de tipo valida, pero ensancha los literales a sus tipos base. El operador satisfies valida y conserva la inferencia exacta, incluidos los valores literales, las claves y la precisión de las tuplas.
type C = { mode: string };
const c = { mode: "dark" } satisfies C;
const exact: "dark" = c.mode;
console.log(exact);Preguntas frecuentes
¿La lección «satisfies frente a la anotación de tipos» es gratis?
Sí — el texto completo de «satisfies frente a la anotación de tipos» 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 «satisfies frente a la anotación de tipos»?
Conserve la inferencia de literales y valide al mismo tiempo la estructura. 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 2 de 4.
¿Cuánto tiempo toma la lección «satisfies frente a la anotación de tipos»?
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