Enums vs Union Types (and const enums)
When to use enums, when to prefer string unions, and what const enums change.
On this page
30‑second interview answer
In many frontend apps, prefer string union types for simple sets of values because they’re lightweight and tree-shake well. Enums can be useful, but they can add runtime output (unless const enum) and have interop considerations. Choose based on whether you need runtime values or just compile-time safety.
Union types (often the best)
type Status = 'idle' | 'loading' | 'success' | 'error';Pros:
- no runtime code
- great with narrowing
Enums
enum Status {
Idle = 'idle',
Loading = 'loading',
}Pros:
- runtime object exists (can be used at runtime)
Cons:
- can add bundle weight
- numeric enums have weird reverse mapping
const enum
const enum inlines values at compile time.
const enum Mode {
Dark = 'dark',
Light = 'light',
}Caution: it can complicate builds across packages.
Mini Q&A
Q1: When use union over enum?
- when you don’t need runtime values.
Q2: What’s the issue with numeric enums?
- reverse mapping and odd runtime behavior.
Q3: What does const enum do?
- inlines values, no runtime object.
Summary checklist
- I prefer unions for simple cases.
- I know enums can add runtime code.
- I understand const enum tradeoffs.
Looking for structured, offline interview prep?
Free online lessons • Portable Amazon Kindle / Paperback
Frontend Interview Guide (2025 Edition)
By Rajesh Dhiman
Comprehensive preparation covering React internals, Web Performance, CSS architecture, and system design questions.
JavaScript Interview Guide
By Rajesh Dhiman
Deep dive into the Event Loop, microtask draining, closures, prototypal inheritance, and asynchronous execution patterns.
Note: All lessons on Frontend Interview remain completely free to read online. As an Amazon Associate, we may earn from qualifying purchases.
Written by Rajesh Dhiman
Authored by Rajesh Dhiman and engineered at Eunix Tech. Focused on deep-dive frontend engineering, JavaScript runtime internals, React architecture, and web performance.