TypeScript: typed JavaScript, checked before it ever runs

One renamed field in an API response, and three screens go blank in production. JavaScript saw nothing coming: it only discovers the shape of a value at the moment that value fails it.

TypeScript moves that check earlier, into the writing itself, without changing anything about the code that eventually runs.

Definition

TypeScript is a superset of JavaScript: any valid JavaScript file is already a valid TypeScript file. It adds type annotations, which its compiler verifies and then strips out. The browser only ever receives ordinary JavaScript.

type Invoice = {
  id: number;
  amount: number;
  paid: boolean;
};

function summarize(invoice: Invoice): string {
  return `Invoice ${invoice.id}: ${invoice.amount} euros`;
}

summarize({ id: 42, amount: 19, paid: true });   // accepted
summarize({ id: 42, amount: "19", paid: true }); // rejected

The last line never gets past the compiler, which answers Type 'string' is not assignable to type 'number'. The report shows up in the editor as the line is typed, not three weeks later in a bug report.

What types catch

• Typos in a property or method name, the leading cause of TypeError in production.
• Missing values: in strict mode, a lookup that may find nothing forces the undefined case to be handled.
• Forgotten cases of a Union type, when a switch fails to cover every possible value.
• Signatures: one argument too many, one left out, a return that hands back something other than what was announced.

const client = clients.find((c) => c.id === 42);
console.log(client.name);
// 'client' is possibly 'undefined'.

The find method may come back empty-handed. In JavaScript this line breaks the day client 42 disappears. In strict TypeScript it refuses to compile until the empty case is dealt with.

What types do not catch

Annotations vanish at compile time. Nothing survives at runtime to police data arriving from the network, from a form or from a JSON file: a declared type is a promise made to the compiler, not a verification.

Frequently asked questions

No, and that is precisely why it spread. The allowJs option lets both extensions live in the same project, so files can be converted one at a time. JSDoc comments even offer a halfway step, with no renaming at all.

Not by a thousandth of a second: what ships is JavaScript with the annotations removed. The cost sits elsewhere, in compilation time and in the learning curve. On a project that lives for several years, it pays for itself at the first serious rewrite.

Yes, and it is the one setting that genuinely changes the picture: without it, null and undefined slip in everywhere and half the guarantees collapse. On an existing project it is switched on option by option, to avoid a wall of a thousand errors at once. Our TypeScript course follows that route, from an ordinary JavaScript project to a strict one.