What is TypeScript?

Difficulty: Beginner

TypeScript is a strongly-typed superset of JavaScript developed and maintained by Microsoft. First released in 2012, it was created by Anders Hejlsberg, the same engineer behind C# and Delphi. TypeScript adds optional static type checking to JavaScript, which means you can catch errors at compile time rather than at runtime. Every valid JavaScript program is also a valid TypeScript program, making adoption incremental and straightforward.

The core value proposition of TypeScript is type safety. In plain JavaScript, you might pass a string where a number is expected and only discover the bug when your application crashes in production. TypeScript catches these mismatches during development, right in your editor. This leads to fewer bugs, better refactoring support, and significantly improved developer experience through autocompletion and inline documentation.

TypeScript compiles (or more accurately, transpiles) down to plain JavaScript. The TypeScript compiler, `tsc`, strips away all type annotations and produces clean JavaScript that runs in any browser, Node.js, or JavaScript runtime. This means there is zero runtime overhead - types exist only during development and compilation. The compiled output is standard JavaScript that behaves identically to hand-written JS.

Adoption of TypeScript has grown dramatically across the industry. Major frameworks like Angular, React (via community types), Vue 3, and Next.js all provide first-class TypeScript support. Companies like Microsoft, Google, Airbnb, and Stripe use TypeScript extensively. The npm ecosystem now includes type definitions for thousands of packages through the DefinitelyTyped project (@types/* packages).

Code examples

JavaScript vs TypeScript comparison

// JavaScript - no type safety
function greet(name) {
  return "Hello, " + name.toUpperCase();
}

greet(42); // Runtime error: name.toUpperCase is not a function

// TypeScript - catches the error at compile time
function greetSafe(name: string): string {
  return "Hello, " + name.toUpperCase();
}

// greetSafe(42); // Compile error: Argument of type 'number' is not assignable to parameter of type 'string'
console.log(greetSafe("world"));

TypeScript prevents you from passing incorrect types. The compiler catches the error before your code ever runs, saving you from runtime crashes.

Type annotations provide documentation

interface User {
  id: number;
  name: string;
  email: string;
  isActive: boolean;
}

function formatUser(user: User): string {
  return `${user.name} (${user.email})`;
}

const user: User = {
  id: 1,
  name: "Alice",
  email: "alice@example.com",
  isActive: true
};

console.log(formatUser(user));

Interfaces serve as both type enforcement and living documentation. Any developer reading this code immediately understands the shape of a User object.

TypeScript catches common mistakes

const items: string[] = ["apple", "banana", "cherry"];

// TypeScript knows .find() might return undefined
const found = items.find(item => item === "banana");

// found is string | undefined - TS forces you to handle the undefined case
if (found) {
  console.log(found.toUpperCase());
} else {
  console.log("Not found");
}

TypeScript tracks nullable values and encourages you to handle edge cases, preventing the infamous 'Cannot read property of undefined' errors.

Key points

• TypeScript is a compile-time tool - all types are erased before the code runs, so there is zero performance cost at runtime.
• You do not need to convert an entire project at once. Rename files from .js to .ts incrementally and add types gradually.
• The TypeScript compiler can target different JavaScript versions (ES5, ES2015, ESNext), making it compatible with older environments.

Concepts covered

TypeScript overview, Static typing, TypeScript vs JavaScript, Type safety