TypeScript Coding Basics

You'll discover why TypeScript was created - Microsoft's 2012 answer to JavaScript's scalability crisis, designed by Anders Hejlsberg, the mind behind Turbo Pascal, Delphi, and C#. You will see how runaway codebases turned silent type errors into business-critical bugs, and understand TypeScript's core thesis: optional static typing layered on top of JavaScript, a superset rather than a replacement that compiles down to plain JS, and why it won out over rivals that tried to replace JavaScript outright.

You'll write and run your very first TypeScript program, printing a greeting to the terminal with console.log. You will save a .ts file, compile it with tsc, run the output under Node, and learn that console.log takes multiple arguments, that backtick template literals let you interpolate expressions inline, and that console.error writes to stderr - then assemble a multi-line intro screen that prints several values in a single, well-formatted call.

You'll learn the two modern ways to bind values - const for things that never change and let for things that do - and watch the compiler infer types straight from your initializers, so a const initialized to a fixed string stays narrow while a let initialized to a number widens to number. You will trigger the errors you get from reassigning a const or assigning the wrong type to a let, then write a loop that increments a counter alongside a fixed greeting to feel the difference in action.

You'll work hands-on with the three foundational primitive types - number, string, and boolean - using both explicit colon annotations like let age: number = 30 and inferred types. You will see that number covers integers and floats alike, that strings concatenate and interpolate, and that boolean accepts only true or false, then put it all together in a small survey that computes an area from typed width and height variables and prints a formatted result.

You'll learn exactly when TypeScript can infer a type for you and when it pays to write one down anyway. You will compile the same program with and without annotations to see the output is identical, then meet the three cases where annotations genuinely earn their keep - function parameters with nothing to infer from, empty arrays that would otherwise widen unhelpfully, and public API boundaries where the type should be a deliberate contract - and add the minimal annotations a function needs to compile.

You'll get a practical handle on TypeScript's escape and bottom types: any, which switches off checking entirely and quietly spreads risk; unknown, which accepts anything but forces you to narrow before you use it; and never, the type of expressions that can't return, like a function that always throws or a fully exhausted switch. You will declare each one, watch a forbidden operation on an unknown get rejected, narrow it with typeof, and print a safe result.

You'll trace TypeScript's evolution across its biggest milestones - from the 0.8 preview in October 2012 and the 1.0 release in 2014, through the maturing structural type system of 2.x, conditional and mapped types, project references in 3.0, template literal types in 4.1, variadic tuples and decorator stabilization in 4.x, all the way to the 5.x era and the ongoing native compiler rewrite. For each milestone you will understand not just when it shipped but why it mattered to working developers.

You'll work through the operators a TypeScript program leans on every day: arithmetic with add, subtract, multiply, divide, modulo, and exponentiation; comparison with a clear focus on why triple-equals strict equality should be your default over double-equals; and the logical and, or, and not operators plus nullish coalescing, which only falls back when the left side is null or undefined. You will watch the compiler reject adding a string to a number, then compute a final price using several operators together.

You'll build branching logic with if, else if, and else, writing programs that read a numeric value and route it through a chain of ranked outcomes before falling through to a default case. You will see one of TypeScript's quiet superpowers in action - how the compiler narrows a union type inside each branch, so a value typed number or null becomes simply number after you guard against null - then combine multiple conditions to decide a tiered result.

You'll write compact branching with the ternary operator condition ? thenValue : elseValue and learn when it sharpens your code and when it muddies it compared to a full if statement. You will also master short-circuit evaluation - how logical and returns the first falsy operand and logical or returns the first truthy one - then use a ternary to pick a greeting by hour of day and short-circuit logic plus nullish coalescing to supply a default when a value is missing.

You'll use switch to replace long if-else chains when matching one value against many constants, building a program that labels a day as a weekday or weekend with case clauses and a default. Then you will unlock exhaustiveness checking: by assigning the discriminant to a never-typed variable in the default branch, the compiler refuses to build if any case is missing - so when you add a new member to the union, it points you to every switch that needs updating.

You'll get ahead of the JavaScript quirks that trip up every TypeScript developer eventually. You will see the six falsy values - false, zero, the empty string, null, undefined, and NaN - and how each behaves inside an if, then learn to tell apart "does this property exist" from "is this value truthy," two checks that look identical until a legitimate zero or empty string is involved. You will finish with the one safe use of double-equals: the deliberate val == null check for null-or-undefined.

You'll get a guided tour of the ecosystem TypeScript now anchors - the tsc compiler, the language servers powering editor IntelliSense, faster build tools like esbuild, swc, tsx, and ts-node, type definitions shipped as @types packages, frameworks that mandate it and others that merely recommend it, runtimes Node, Deno, and Bun, and meta-frameworks that assume TypeScript by default. You will come away able to recognize each of these players when they show up in job postings and tutorials.

You'll master the two classic loop forms that carried over from JavaScript: a counted for loop with a typed index summing the numbers one through ten, and a while loop that drains a queue until it's empty. You will learn which fits when - for when the bounds are known up front, while when termination depends on data you haven't seen yet - use break and continue to control flow, then write a while loop that doubles a value past one thousand and reports how many doublings it took.

You'll learn the array type in both number[] shorthand and Array<number> generic form, then build and manipulate arrays with push, pop, length, and bracket indexing. You will put the high-value methods you'll use daily into practice - map to transform every element, filter to keep the matches a predicate selects, and find to grab the first one - by taking an array of numbers, transforming each with map, filtering by a threshold, and printing each stage of the pipeline.

You'll see exactly what for-of and for-in each produce, and why mixing them up causes bugs. A for-of loop hands you the elements of an iterable, so you get each value directly; a for-in loop hands you the enumerable keys, which on an array means stringified indices - almost never what you want. You will run both on the same array side by side, then sum a number array with for-of and walk the keys of a record object with for-in to build a printed report.

You'll move beyond plain arrays to two precise refinements: tuples, fixed-length arrays where each position has its own type, perfect for paired values or returning multiple results; and readonly arrays, which guarantee a function won't mutate the data you pass it. You will declare a [string, number] tuple, destructure it, return one from a function, then try to push to a readonly array, watch the compile error, and build a new array with the spread operator instead.

You'll learn the three keyed collections TypeScript developers reach for and when each is the right call - plain objects as lightweight records, Map when keys may be non-strings or insertion order and frequent edits matter, and Set for unique values, deduplication, and membership tests. You will build a word-frequency counter using a Map from string to number, print the entries in insertion order, then rebuild the same logic with a plain object and compare the two.

You'll pick up two pieces of syntax that make working with data far more pleasant. Object destructuring pulls named properties into local bindings, with optional renaming and defaults; array destructuring does the same by position and pairs perfectly with tuples; and the spread operator copies an array or object into a new one, which is how you express immutable updates. You will destructure a data object, spread an existing array into a new one with an extra element, and apply an immutable update by spreading an object.

You'll take a frank, balanced look at the principles behind TypeScript's design and the real costs they carry. You will understand structural typing that values shape over name, the deliberate choice to be a strict syntactic superset of JavaScript, the soundness compromises the team accepted for usability - bivariant parameters, the any hatch - and the decision to erase types at runtime. And you'll hear the honest downsides too: slow compiles on huge projects, type-definition drift in npm, and the complexity ceiling of advanced generics.

You'll learn the two ways to define a function - the function keyword and the arrow form - with typed parameters and return types in both. You will see the practical differences that actually matter: function declarations are hoisted and bind their own this, while arrow functions are not hoisted and inherit this from the enclosing scope, which is exactly what you want in class methods and callbacks. You will write the same simple function both ways and confirm they behave identically.

You'll handle real-world function signatures with three pieces of parameter syntax: optional parameters marked with a question mark that may be left out, default parameters that supply a value when the caller omits the argument, and rest parameters prefixed with three dots that gather any extras into a typed array. You will build a greet function combining an optional title, a default greeting, and a rest array of names, then call it several ways and print each assembled message.

You'll learn that functions have types of their own, written with arrow syntax like (a: number, b: number) => number - essential the moment you accept a callback or store a function in a variable. You will write a higher-order function that takes a number and a transformer with a fully spelled-out signature, pass it different transformers, name the signature with a type alias, then add a predicate parameter so the transformer only runs when the predicate returns true.

You'll learn the two ways to name a shape - type aliases, which can name anything including unions, intersections, and primitives, and interfaces, which model object shapes but can be extended and merged across declarations. You will declare the same shape both ways, see that they're interchangeable at the use site, extend an interface, and learn the rule of thumb: interface for an extensible object contract, type alias for a union, tuple, or computed type.

You'll master the two operators that combine types: a union A | B, meaning a value is one or the other and must be narrowed before you use type-specific operations, and an intersection A & B, meaning a value carries the properties of both. You will narrow a string | number parameter with typeof to handle each case differently, then intersect one object type with another so the result carries both sets of properties, and see how unions and intersections work together in a single example.

You'll learn the feature that turns TypeScript into a tool for precise contracts: literal types, whose only allowed value is a single specific one, and which combine with unions to demand a value be one of a fixed set the compiler enforces. You will also use const assertions - as const - to freeze an entire object so every property becomes a literal, then define a string-literal union, write a function that accepts only it, and watch an unexpected string get rejected.

You'll see TypeScript's real-world footprint in hard numbers - adoption from surveys like State of JS where it ranks among the most-used flavors of JavaScript, plus the companies that have bet heavily on it. You will compare indicative build speeds of tsc against faster type-stripping transpilers, look at where the adoption energy is heading, and weigh an honest industry health check - so you can judge whether it's worth the next five years of your career.

You'll learn the default model for asynchronous work in TypeScript. You will build a function that returns a Promise resolving after a timeout, await it inside an async function, and see that async functions always return Promises, that await pauses until a Promise settles, and that errors flow through rejection in a try/catch-friendly way. You will run several simulated calls in sequence with timing, then refactor them to run concurrently with Promise.all and watch the speedup.

You'll push past simple await into real concurrency. You will learn when Promise.all is right - all-or-nothing fan-out that rejects on the first failure - versus Promise.allSettled, which waits for everything and reports each outcome so partial success is fine. For true CPU parallelism you will reach for Node Worker Threads. You will run several mock calls with allSettled, see which succeeded and which failed, then build a worker that computes a heavy sum off the main thread.

You'll learn about functions that pause and resume. A generator declared with function* yields values one at a time, computing the next only when asked, which lets you model infinite sequences without exhausting memory and build pull-based pipelines. You will write a simple generator that yields a fixed sequence, build one that yields Fibonacci numbers forever and pull the first several with a for-of loop, then compose a generator that filters another iterable on the fly.

You'll master the functional triad that replaces most explicit loops in idiomatic TypeScript: map to transform every element, filter to keep the ones matching a predicate, and reduce to collapse a collection into a single value. You will take an array of order objects, filter for the paid ones, map out their totals, and reduce them into a single revenue figure - printing each stage - then compare the same logic written as an imperative for-loop.

You'll learn the two ideas that make functional TypeScript expressive: higher-order functions, which take or return other functions, and closures, where a function captures and keeps alive variables from its enclosing scope. You will build a counter factory that returns a function holding a private count, call it repeatedly to see the captured state persist, build a multiplier factory that closes over its config, then write a debounce that wraps any function with a delay.

You'll compare JavaScript and TypeScript head-to-head across the dimensions that matter daily - type safety, tooling and editor support, refactoring confidence, runtime behavior, build complexity, learning curve, error messages, library compatibility, and team scalability. You will see clearly which problems TypeScript solves cleanly, which it merely shifts to another layer, and which it doesn't touch - and when plain JavaScript is still the correct choice - leaving you with a mental model for picking the right tool.

You'll learn the mechanism that lets you write code once and keep types intact across every use. A generic function with an angle-bracket type parameter takes a value of that type and returns the same type, so the compiler knows the output matches the input. You will write the canonical identity function, a generic first that returns a T from a T[] array, watch type inference fill in the brackets for you at the call site, build a generic Box class, then build a generic Pair class.

You'll make generics smarter by constraining and branching on them. A constraint like T extends Named tells the compiler T must have certain properties, which then become available in the body; a conditional type like T extends string ? A : B picks one type or another based on the input - the foundation of much of the standard library. You will write a getProperty whose key is constrained to keyof the object and returns the precisely typed value, then a conditional type using infer that strips Promise wrappers off a type.

You'll learn the built-in utility types that replace most hand-written type manipulation: Partial makes every property optional, Required does the reverse, Pick selects a subset, Omit excludes one, and Record maps a key type to a value type. You will define an interface, write a function that merges a Partial patch into an existing object, declare a Record from role strings to an abilities array and print the lookup, then carve out safe-to-share shapes with Pick and Omit.

You'll learn two complementary ways to handle errors and see the tradeoffs in code. First the traditional try/catch with thrown errors and a catch parameter typed unknown in modern TypeScript, which you must narrow before reading the message. Then the Result pattern, where a function returns a discriminated union of { ok: true, value } or { ok: false, error } that forces the caller to handle both branches. You will write a function that throws, then build one that returns a Result instead and handle both branches.

You'll learn how TypeScript expresses the kind of record-style data carrier that Java has as records and Python has as dataclasses. Parameter properties let you declare and initialize every field right in the constructor signature for a compact class, and the readonly modifier blocks mutation after construction to give you an immutable value object. You will build a Point class with two readonly fields and a distance method, instantiate several, then express the same shape as a readonly type with a factory function and contrast the two.

You'll learn the standardized syntax for attaching metadata and modifying behavior at the class and method level - decorators, which follow the Stage 3 proposal and are on by default in tsc 5.x. You will write a class decorator that logs every instantiation and a method decorator that wraps a method with timing instrumentation, apply them to a class and watch the log lines, then run a heavy method through the timing decorator and read the measured cost off the console.

You'll go under the hood to see the four phases tsc runs every time you save: the parser turns source text into a syntax tree, the binder builds the symbols connecting names to declarations, the checker performs inference and validation to produce the types you see in error messages, and the emitter writes the JavaScript and optional declaration files. Understanding each stage's cost will give you a mental model for why some refactors feel instant while others pause your editor.

You'll explore the type system's defining decision: compatibility is based on shape, not declared name. A function expecting a point with x and y will accept any object that has them, no matter how it was constructed - unlike Java or C# where nominal typing demands a declared inheritance link. You will see the productivity wins, the surprising assignments structural typing permits, and the rare cases where you want nominal-style safety and reach for branded types as a workaround.

You'll confront the hard truth that types vanish at runtime. TypeScript strips every annotation during emit, so the executing JavaScript knows nothing about the types you wrote - which is why instanceof works on classes but not interfaces, why you can't reflect over a generic, why JSON.parse returns any, and why runtime validator libraries exist. You will get a clear picture of design-time types on one side, runtime values on the other, and a one-way arrow between them - framing a whole class of bugs before you hit them.

You'll walk through the design patterns the TypeScript community has settled on, explained conceptually so the structural ideas land cleanly: discriminated unions for state machines, the builder pattern reinterpreted with fluent return types, the strategy pattern reduced to a typed function, and the Result type instead of exceptions. You will learn which classic Gang-of-Four patterns translate cleanly, which the language makes unnecessary, and which feel awkward and are best left behind.

You'll get a field guide to where TypeScript has become the default in production - large single-page frontends, backend services on frameworks like Nest.js and runtimes like Bun and Deno, cross-platform mobile via React Native, desktop apps via Electron, browser extensions, CLI tools, infrastructure-as-code, edge serverless, and library authoring where shipping high-quality types is now table stakes. You'll come away knowing where it wins, where it struggles, and where it's the wrong tool.