Skip to content
Learn Netverks

Lesson

Step 22/32 69% through track

discriminated-unions

Discriminated unions

Last reviewed May 28, 2026 Content v20260528
Track mode
client_typescript
Means
In-browser TS
Reading
~1 min
Level
intermediate

This lesson

This lesson teaches Discriminated unions—the ideas, syntax, and habits you need before moving on in TypeScript.

Narrowing and unions model real-world data shapes and eliminate whole classes of runtime bugs.

You will apply Discriminated unions in contexts like: Modern front-end apps, Node APIs, and any team that standardizes on TS-first tooling.

Write TypeScript, compile in the browser, run the emitted JavaScript, and check understanding with MCQs.

When the previous lesson's MCQs feel easy and you can explain Discriminated unions in your own words.

A shared literal field (kind, type, status) lets switch narrow safely—ideal for API results and UI state machines.

Modeling API results

type ApiResult<T> =
  | { ok: true; data: T }
  | { ok: false; status: number; error: string };

Consumers switch on ok—TypeScript knows which fields exist in each branch.

Self-check

  1. Add a third variant loading—what breaks if you forget to update switches?

Challenge

Shape area

  1. Model Circle | Rectangle with a kind field.
  2. Write area(shape) using switch on kind.
  3. Print areas for one of each.

Done when: two numeric areas in terminal.

Interview tip Lesson completion confidence

Can you explain this lesson in 30 seconds without reading notes?

Not saved yet.

Playground

Runs in your browser in a sandboxed frame. Backend runners appear when this track’s profile allows them.

Check yourself

Multiple choice — immediate feedback.

Discussion

Past discussion is visible to everyone. Only logged-in users can post comments and replies.

Starter discussion topics

  • What part of this lesson needs a second read?
  • What would you try differently in a real project?

Sign up or log in to post comments and sync lesson progress across devices.

No discussion yet. Be the first to ask a question.

Jump

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32