Modern TypeScript tour

TS 4 recap

TypeScript 4 hardened everyday patterns: stricter unknown handling, variadic tuples, template literal types, and control flow that remembers more. Most migration guides for that era read as small cleanups, not rewrites.

The practical takeaway was simple: model data with precise literals and unions, then let narrowing do the rest. Later versions kept that direction and added sharper tools.

function pair<First, Rest extends Array<unknown>>(first: First, ...rest: Rest): Array<unknown> { return [first, ...rest]; } const both: Array<unknown> = pair("a", 1, true); console.log(both);

satisfies and const

The satisfies operator checks an expression against a type without widening or changing its inferred shape. Autocomplete stays exact while mismatches still error.

Pair it with as const for literal collections that must never widen. Write the value once, and let the checker guard both the shape and the spelling.

const sizes = ["s", "m", "l"] as const; const palette = { accent: "teal" } satisfies Record<string, string>; console.log(sizes[0]); console.log(palette.accent);

const enums vs unions

String unions now cover most cases that once needed enums. They are lightweight, tree shake cleanly, and produce clear hover types.

Declare the union once and annotate every picker with it. Misspellings fail at compile time with the full list of allowed values in the message.

type Size = "s" | "m" | "l"; const pick: Size = "m"; console.log(pick);

Standard decorators

Standard decorators attach behavior to classes and methods through a short annotation above the declaration. Factories like logged wrap any handler with timing or tracing.

Async decorators pair naturally with the promises background material when setup or teardown awaits. Keep decorator logic tiny and put real work in plain functions.

function tag(target: object, key: string): void { console.log(key); console.log(target); } tag({}, "save");

Next: Hero roadmap: the whole course on one page

Article author: Arthur Isaev