Skip to content
Mage spell

TypeScript

Ranks 1-3

JavaScript wearing the mage's Mana Shield: the same spells, plus a ward that catches mistakes before the battle starts.

Wears the Classic spell Mana Shield.

Coming from Python: If you wrote type hints, you already speak the idea. TypeScript is those hints enforced by a compiler that reads your whole program and argues with you, correctly, before it runs.

Advertisement

Summoning the language

Rank 1

First summoning

Rename one hello.js to hello.ts, add types to the variables, and run it through the compiler. The types vanish at runtime; they exist purely to catch you.

const level: number = 60;
function heal(target: string, amount = 10): string {
  return `${target} healed for ${amount}`;
}
heal("tank");        // fine
heal(42);            // the ward lights up
Rank 2

The temper

Describe shapes with interface, allow exactly the options you mean with union types, and let the compiler narrow them for you. The discipline pays when a function can receive six kinds of thing and must survive all six.

interface Spell { name: string; rank: number; }
type CastResult = Spell | "on-cooldown" | "out-of-mana";
function cast(r: CastResult): string {
  if (r === "on-cooldown") return "wait";
  return r.name;  // the compiler knows r is a Spell here
}
Rank 3

First real chore

Turn on strict mode in the to-do app from the JavaScript ranks and let the compiler review it. Every error it reports is a bug your future self no longer has. This is the whole value proposition, felt rather than argued.

// tsconfig.json: "strict": true
// then: npx tsc --noEmit  (review, learn, repeat)
Back to the grimoireThe Programmer's GrimoirePython, the eight ranks, and every second spell.