082 — Type Basics (primitives, inference, and typed function params)

Video: 082 · TypeScript Tutorial #3 - Type Basics · watch · ~7:34 · Net Ninja TypeScript tutorial series, lesson 3 (Shaun)

Source: this is a written companion to the video. Part of the Favorite TypeScript Videos curated path, module 00 (foundations). The strict-types promise from lesson 1 becomes hands-on: values may change, types may not.

values may change; types may not

character (string), age (number), isBlackBelt (boolean) each refuse cross-type reassignment with Type 'X' is not assignable to type 'Y' squigglies, while same-type updates pass freely.

let character = "mario";
character = "luigi"; // fine — still a string
character = 20; // error: Type 'number' is not assignable to type 'string'

Hovering the squiggly reveals the assignability error: a number is going into a string slot, and the compiler refuses the swap.

The rule holds for every primitive: strings (single or double quotes), the single number type covering ints and decimals — TypeScript has one number type, no int/float split — and booleans.

inference first — annotations can wait

No annotation is written in the whole lesson: “TypeScript uses what’s known as inference, or it infers the type based on the value we assign it,” confirmed by hovering to see the inferred type (“hover over character, we can see it says, character is a string”). Explicit parameter/return annotations arrive later; inference carries the basics.

untyped parameters compile lies; typed parameters refuse them

The payoff demo is a circ function computing diameter * Math.PI. Untyped, passing "hello" compiles clean and fails at runtime; annotate diameter: number and the bad call errors at the call site before anything runs. Shaun’s phrasing is that it won’t compile with the wrong type sent in — strictly, tsc with default settings still emits JavaScript despite type errors (only noEmitOnError stops emit), so the real gate is the reported error, not a blocked emit.

const circ = (diameter: number) => diameter * Math.PI;
circ("hello"); // error: Argument of type 'string' is not assignable to parameter of type 'number'
circ(7.5); // compiles, logs the circumference

The hover names the mismatch — a string argument against a number parameter — which is the contract in action: call this function and you pass a number. The check is done before compile, not at runtime in the browser: with tsc sandbox.ts -w from lesson 2 kept running throughout, the error is reported at the call site and the watch session only goes clean once the call is fixed.

Prev: 081 — Compiling TypeScript · Next: 083 — Objects and Arrays

The auto-transcript mishears a few terms; this narrative uses the corrected forms: the isBlackBelt boolean demo variable (plus a live typo, isBulkBelt, fixed on the spot), circ for the circumference function (diameter * Math.PI; Math available because TypeScript extends JavaScript), the squiggly line for the VS Code inline type-error underline (hovering reveals the assignability message), and tsc sandbox.ts -w (the “watch flag”) carried over from lesson 2, kept running throughout.