Type System Deep Dive
Union Types
Master Union Types (|) in TypeScript, handling shared properties, type narrowing, string/number literal unions, and union type assignability rules.
Last Updated: July 29, 2026
•
10 min read
A Union Type expresses a value that can be one of several types. You form a union type by joining two or more types using the vertical bar (|) operator.
1. Syntax & Core Concept
2. Accessing Members of Union Types
If a value has a union type, TypeScript only allows accessing members that are common to all types in the union, unless you narrow the type first.
3. String & Literal Union Types
Union types are commonly combined with Literal Types to create robust set parameters (replaces enums):
4. Interactive Code Playground
Test union types below:
5. Summary Table
| Concept | Syntax | Description | |
|---|---|---|---|
| Union Definition | TypeA \ | TypeB | Value can be either TypeA or TypeB |
| Access Restriction | Shared properties only | Can only access members present on ALL union arms |
typeof, in, instanceof | Unlocks arm-specific methods safely |