Language Deep Dive

TypeScript

JavaScript with a type system. The de-facto choice for serious frontend and backend JS work — catches bugs at compile time without leaving the JS ecosystem.

Statically TypedSuperset of JSCompiles to JSStructural TypingMulti-paradigm
← Back to Client Side
Quick Facts

At a Glance

Created
2012 · Microsoft
Designed by
Anders Hejlsberg
Compiles to
JavaScript (any version)
Typing
Static, structural, gradual
Compiler
tsc, swc, esbuild

Basic Concepts

  • Superset of JavaScript: any valid JS is valid TS.
  • Type erasure: types vanish at compile time — runtime is plain JS.
  • Structural typing: compatibility based on shape, not name.
  • Gradual typing: mix typed and untyped code; opt-in strictness.
  • Type inference means you rarely have to write the obvious types.
Syntax

Taste of TypeScript

type Customer = {
  name: string;
  age: number;
  active?: boolean;     // optional
};

function greet(c: Customer): string {
  return `Hello, ${c.name}!`;
}

// Discriminated unions — pattern matching without runtime cost
type Result<T> =
  | { ok: true;  value: T }
  | { ok: false; error: string };

function handle<T>(r: Result<T>) {
  if (r.ok) use(r.value);
  else      log(r.error);
}
Mechanics

Key Features

The Type System
  • Primitive types: string, number, boolean, null, undefined, symbol, bigint.
  • Unions (A | B) and intersections (A & B).
  • Generics for reusable, type-safe code.
  • Mapped & conditional types for advanced type transformations.
  • Literal types like "GET" | "POST".
Strictness Settings

Turn on "strict": true in tsconfig.json for the safest mode. Includes strictNullChecks (no surprise nulls), noImplicitAny, and more.

Inference & Narrowing

TypeScript figures out most types automatically. Inside an if (typeof x === "string") block, x is treated as a string. This narrowing makes typed code feel natural to write.

Tooling
ToolPurpose
tscThe reference compiler from Microsoft.
esbuild / swcUltra-fast TS-to-JS transformers (skip type checking).
ts-node / tsxRun TypeScript directly in Node without a build step.
Zod / Valibot / io-tsRuntime validation that infers TS types.
Type definitions@types/* packages from DefinitelyTyped.
Trade-offs

Strengths & Weaknesses

Strengths
  • Catches bugs at compile time; massive win on big codebases.
  • World-class IDE autocomplete and refactoring.
  • Rich, expressive type system.
  • Adoptable gradually — no rewrite required.
Weaknesses
  • Adds a build step and tsconfig complexity.
  • Type gymnastics can over-engineer simple code.
  • 3rd-party type definitions occasionally lag or are wrong.
  • Still has all of JavaScript's runtime quirks underneath.
Where It Shines

Sweet Spots

Large Frontend Apps

React, Vue, Angular, Svelte — all TypeScript-first today.

Backend APIs

NestJS, Fastify, Hono, tRPC — type-safe end-to-end.

Library Authoring

Publish strong types; consumers get IntelliSense for free.

Full-stack with Type Sharing

Same types on client and server (e.g., tRPC, Remix).

Continue

Other Languages