Programming languages
TypeScript
A superset of JavaScript with static types that compiles to plain JS.
What it is
TypeScript adds a type system to JavaScript. The compiler checks code before it runs, then strips the types and emits plain JS. TypeScript does not exist at runtime.
Anders Hejlsberg (the author of C#) created it at Microsoft, with a first public release in 2012. Any valid JS is valid TS, so migration can go gradually, file by file.
Types give autocomplete, safe refactoring and catch whole classes of bugs (undefined is not a function) in the editor. Most modern frameworks are written in TS.
Use it when
- The codebase is long-lived or has a team: types act as living documentation.
- You need safe refactoring of a large frontend or Node.js backend.
- You write a library: types become part of the public API.
- You want shared types between client and server.
Avoid it when
- A throwaway script or tiny prototype where the build step costs more than it gives.
- Data arrives from outside without validation: types are not checked at runtime, you still need Zod or similar.
Key concepts
- Structural typing
- Type compatibility is decided by the shape of an object, not its name. If the fields match, the type fits.
- Generics
- Types with parameters, like
Array<T>: one piece of code works with many types while staying checked. - Union and narrowing
- A type
A | Bplus checks (typeof,in, a discriminant) narrow it to a specific variant. - Utility types
- Built-in type transformations:
Partial,Pick,Omit,Record,ReturnType. - unknown vs any
anyturns checking off,unknownforces you to narrow first. The second is safer.
Example
Cheat sheet
| Command or code | What it does |
|---|---|
npx tsc --init | Creates tsconfig.json |
npx tsc --noEmit | Type check without emitting files |
type User = { id: number; name: string } | Object type alias |
interface Props { title?: string } | Interface with an optional field |
type Id = string | number | Union type |
function id<T>(x: T): T { return x } | Generic function |
Partial<User> | Makes all fields optional |
Pick<User, 'id' | 'name'> | Keeps only the listed fields |
Record<string, number> | Object with string keys and number values |
const x = value as const | Narrows to literal readonly types |
type T = ReturnType<typeof fn> | Type of the value a function returns |
How to learn it
- First know JavaScript well: without it, types only add confusion.
- Take the TypeScript course on ShortLesson, then the JS to TS migration course.
- Learn basic types, interfaces, unions and literal types.
- Study generics and the Partial, Pick, Omit, Record utilities on small examples.
- Turn on strict in tsconfig and fix every error in a small project.
- Type a real API: describe responses and function parameters.
- Read the TypeScript Handbook on the official site.
- Practice type narrowing and discriminated unions.
Interview questions
1. What is the difference between type and interface?
Both describe an object shape.
interfacecan be extended through declaration merging andextends, whiletypesupports unions, intersections and conditional types. For plain objects either works, consistency matters most.2. How does unknown differ from any?
anyturns type checking off for a value.unknownaccepts anything but forces you to narrow the type before use. That makesunknownsafer for external data.3. What are generics and why use them?
Type parameters that let you write functions and classes for any type while keeping type information. For example,
function first<T>(a: T[]): Treturns the same type the array holds.4. Does TypeScript check types at runtime?
No, types are erased after compilation. Network data must be validated separately (Zod, Valibot), and the type can be inferred from the schema.
Interview questions from the bank
- Why does TypeScript complain about an extra field in a fresh object literal, but not when the same object is first put into a variable? Does the type trim the extra field at runtime?JuniorTypeScript
- Why can
let role = 'admin'not be passed to a function that accepts'admin' | 'user', whileconst role = 'admin'can? What doesas constadd?JuniorTypeScript - A parameter has the type
string | string[] | null. Why doesif (typeof input === 'object')not removenull, and how do you narrow the type correctly?JuniorTypeScript - Status labels are typed as
labels: { [key: string]: string }.'refunded'was added to theStatusunion but its label was forgotten: the admin panel shows a blank, andlabels[status].toUpperCase()throwsTypeError.tscsaid nothing. How do you type the map so the compiler catches this?JuniorTypeScript const list = ids.map(async (id) => fetchUser(id)), thenlist.filter((u) => u.active), andtscsaysactivedoes not exist on typePromise<User>. What is going on and how do you fix it?JuniorTypeScript- The type is
ApiUser = BaseUser & { id: number }, whileBaseUserhasid: string. The error shows up not at the declaration but where an object is created, and it mentions a strangenever. Withinterface ApiUser extends BaseUserthe error would appear immediately. Why, and by what rule do you chooseinterfaceortype?MiddleTypeScript - A queue consumer does
const msg = JSON.parse(raw) as OrderEventand thenmsg.items.length. After the producer changed the format, the consumer crashes withTypeErrordeep in business logic rather than at the entry point. What type shouldmsghave, and what is the role ofany,unknownandneverin this code?MiddleTypeScript refundedwas added to the events union, but the handler was not updated. How do you make the compiler catch this, and why is it better thandefault: return 'unknown'?MiddleTypeScript
Comparisons with this technology
Related technologies
- JavaScriptThe language of the web: runs in every browser, and on the server through Node.js, Deno and Bun.
- ReactA library for building interfaces from components: UI as a function of state.
- Node.jsA server-side JavaScript runtime built on the V8 engine with an event-driven, non-blocking I/O model.
- NestJSA progressive TypeScript Node.js framework with modules, decorators and dependency injection.
Logos belong to their owners and are used for identification only. Icons: Simple Icons (CC0), Devicon (MIT).