satisfies Operator (TS 4.9)

TL;DR

Explanation

Before satisfies, you had to choose: use 'as Type' (loses inference) or rely on inference (no type safety). satisfies validates the shape without widening. Example: const palette = { red: [255,0,0], green: '#00ff00' } satisfies Record<string, string | number[]> — TypeScript knows palette.red is number[] (not string | number[]) because inference is preserved. This enables calling .toUpperCase() on palette.green without a type assertion, while still checking it conforms to the Record type. Useful for config objects, CSS-in-JS, and any case where you want validation without losing specificity.

Common Misconception

Why It Matters

Common Mistakes

• Using 'as Type' when satisfies is more appropriate — 'as' silences errors.
• Using satisfies without understanding it preserves inferred types for each property.
• Expecting satisfies to change the runtime behaviour — it's compile-time only.

Code Examples

// As-assertion loses specificity:
const config = {
    timeout: 5000,
    endpoint: '/api'
} as Config; // config.timeout is now Config['timeout'], not 5000

type Config = { timeout: number; endpoint: string };

const config = {
    timeout: 5000,    // TypeScript knows this is 5000, not just number
    endpoint: '/api'  // TypeScript knows this is '/api', not just string
} satisfies Config;

config.timeout; // type: 5000 (literal) — not number

References

• ↗ https://www.typescriptlang.org/docs/handbook/release-notes/typescript-4-9.html#the-satisfies-operator

Tags

Related Terms