TypeScript Design Patterns Every Senior Dev Should Know

TypeScript has matured from a JavaScript flavour to a powerful tool for encoding domain logic in types. Senior engineers who embrace TypeScript's type system can eliminate entire categories of bugs at compile time.

Discriminated Unions for State Machines

Instead of sprinkling boolean flags across your state objects, use discriminated unions to model every valid state explicitly. The compiler enforces exhaustive handling in switch statements, making impossible states unrepresentable.

type AsyncState<T> =
  | { status: "idle" }
  | { status: "loading" }
  | { status: "success"; data: T }
  | { status: "error"; error: Error };

Builder Pattern with Generics

For complex object construction, a builder pattern with generic type inference gives you compile-time validation that all required fields are set before calling build(). This eliminates entire classes of runtime errors in form handling, API request construction, and configuration objects.

Template Literal Types for Compile-Time Validation

TypeScript 4.1 introduced template literal types, allowing you to validate string formats at compile time. Use them for CSS class names, URL patterns, event names, and any domain-specific string format where typos cause runtime bugs.

Const Assertions and Satisfies

The satisfies operator (TypeScript 4.9) lets you validate an object against a type while preserving the most specific inferred type. Combined with as const, this pattern is ideal for configuration objects, lookup tables, and route definitions.

Branded Types for Domain Safety

A UserId and an OrderId are both strings, but they should never be interchangeable. Branded types create nominal typing on top of TypeScript's structural type system, preventing entire categories of mix-up bugs that are impossible to catch with plain string types.