ProgramGuru

exactOptionalPropertyTypes

exactOptionalPropertyTypes — why it matters

exactOptionalPropertyTypes treats an optional property as absent or of its declared value type, not automatically present with undefined. This matters when code distinguishes "key not present" from "key exists with undefined" using in or Object.hasOwn. Reading the optional property can still yield undefined.

What you’ll learn

  • Explain exactoptionalpropertytypes and the problem it solves.
  • Identify the relevant compile-time checks and runtime responsibilities.
  • Run the example, predict its output, and try a realistic modification.

Understand the mechanism

An omitted theme is absent from the first object. The second object has an actual dark value. With the flag on, assigning {theme:undefined} would be an error unless undefined is explicitly included.

Optional property and property with the explicit value undefined are different runtime object shapes.

Follow the concept flow

exactOptionalPropertyTypes — concept flowOptional property → Absent versus undefined → Exact assignment ruleexactOptionalPropertyTypes1Optional property2Absent versus undefined3Exact assignment ruleCompiler configuration changes checks and output, not runtime guarantees.
Follow the responsibilities from input to checked result.

Run the primary TypeScript example

Save as exactoptionalpropertytypes.ts. The following program passed strict TypeScript compilation, and the displayed output was captured by executing its emitted JavaScript with Node.js 22.16.0.

TypeScript source

type Preferences = { theme?: "light" | "dark" };
const automatic: Preferences = {};
const chosen: Preferences = { theme: "dark" };
console.log("theme" in automatic);
console.log(chosen.theme);

Verified output

false
dark

Compile: npx tsc --strict --target es2022 --module commonjs exactoptionalpropertytypes.ts; run: node exactoptionalpropertytypes.js. For Node.js API examples, install @types/node first. For browser projects, use the browser-specific instructions below.

The example demonstrates the code-level behavior; the related configuration or test commands are shown separately when needed.

Trace the result

An omitted theme is absent from the first object. The second object has an actual dark value. With the flag on, assigning {theme:undefined} would be an error unless undefined is explicitly included.

Predict what changes if you alter one input. Then run the code to compare your reasoning with the real output.

Common mistake and correction

Optional property and property with the explicit value undefined are different runtime object shapes.

Identify whether the failure is a type-checking issue, a configuration issue, or a runtime behavior issue before choosing a fix.

Practice the concept

Enable exactOptionalPropertyTypes and try assigning {theme:undefined}. Then add | undefined and retry.

Write down your expected result first. For configuration examples, compare compiler output and diagnostics; for test examples, make the assertion fail deliberately to verify that the tool reports it.

Check your understanding

What should you remember when configuring TypeScript compilation?
Choose one answer. You can try again.

Answer and explanation

Compiler options control static checks or emitted files; running the result is a separate step.

An omitted theme is absent from the first object. The second object has an actual dark value. With the flag on, assigning {theme:undefined} would be an error unless undefined is explicitly included.

Official reference

For the exact current options and platform behavior, consult the official documentation. These examples were verified using the tool versions described above.

What to remember

exactOptionalPropertyTypes treats an optional property as absent or of its declared value type, not automatically present with undefined.

Run the primary example, then complete the practice task or environment-specific lab.

Reaching the recap and completing the quizzes are separate milestones.

    Next lesson: Configuring rootDir and outDir →