TypeScript Introduction
Understand what TypeScript is, why it exists, and how it improves on plain JavaScript with static types.
Reading Time
10 min
Lesson
Lesson 1 of 30
What is TypeScript?
TypeScript is a superset of JavaScript developed by Microsoft that adds static typing. Every valid JavaScript program is also valid TypeScript — TypeScript just lets you optionally describe the shape of your data, and catches type-related bugs before your code ever runs.
Why Add Types to JavaScript?
JavaScript is dynamically typed — a variable can hold any type, and mistakes like calling a method that doesn’t exist on a value only surface at runtime. TypeScript catches these mistakes at compile time, right in your editor, before the code ever runs.
JavaScript vs TypeScript
// Plain JavaScript — no error until this line actually runs
function greet(name) {
return "Hello, " + name.toUppercase(); // typo: should be toUpperCase
}
// TypeScript — the typo is flagged immediately, before running anything
function greetTyped(name: string): string {
return "Hello, " + name.toUppercase(); // Error: Property 'toUppercase' does not exist
}Quick Facts
| Feature | Value |
|---|---|
| Created By | Microsoft |
| First Released | 2012 |
| Relationship to JavaScript | A typed superset — compiles down to plain JavaScript |
| File Extension | .ts (or .tsx for files with JSX) |
| Runs In | Nowhere directly — it compiles to JavaScript first |
TypeScript Compiles to JavaScript
Browsers and Node.js don’t understand TypeScript directly. The TypeScript compiler (tsc) reads your .ts files, checks the types, and outputs plain .js files that run anywhere JavaScript already runs.
Why Learn TypeScript?
- Catches bugs at compile time instead of at runtime.
- Provides autocomplete and inline documentation in your editor.
- Makes refactoring large codebases far safer.
- The default choice for most modern frontend frameworks and large Node.js projects.
- Types double as living documentation for how your code should be used.
TypeScript Types Are Erased at Runtime
Type annotations exist only during development and compilation — the compiled JavaScript output has no types left in it at all. TypeScript adds zero runtime overhead.
Best Practice
You don’t need to type everything explicitly from day one. TypeScript’s type inference handles most cases automatically — start simple, and add explicit types where they add real clarity.