Discriminated Unions
Design clean union models using a common discriminator field for safe branching logic.
David Miller
January 13, 2026
0.3k8
Discriminated unions use a common field to decide type.
## Example: API state
```ts
type Loading = { status: "loading" };
type Success = { status: "success"; data: string };
type ErrorState = { status: "error"; message: string };
type State = Loading | Success | ErrorState;
```
## Handle safely
```ts
function render(s: State) {
switch (s.status) {
case "loading":
return "Loading...";
case "success":
return s.data;
case "error":
return s.message;
}
}
```
TypeScript knows which fields exist.
## Graph
```mermaid
flowchart TD
A[State] --> B[loading]
A --> C[success]
A --> D[error]
```
## Remember
- Use a shared tag field
- Makes logic safe and readable
#TypeScript#Advanced#Unions