Basic

Primitive Types

Annotate variables with the core TypeScript types: string, number, boolean, and their runtime equivalents.

What you will see

10 hi

About 2 min of reading

Try It

TypeScript's `: type` annotation is checked at compile time and erased at runtime, so the emitted JavaScript prints exactly the same as unannotated code. Run each snippet in Node and watch the annotations simply vanish.

1

Declaring typed variables

const name: string = "Ada"; const age: number = 30; const active: boolean = true;

Before you run it, say out loud what it will print. Then open the answer.

What it prints
Ada 30 true
2

The number, bigint, and string families

const whole: number = 42; const huge: bigint = 9007199254740991n; const label: string = "text"; console.log(whole, huge, label);

Before you run it, say out loud what it will print. Then open the answer.

What it prints
42 9007199254740991n text
3

TypeScript's inferred types

const x = 10; const y = "hi"; console.log(x, y);

Before you run it, say out loud what it will print. Then open the answer.

What it prints
10 hi

Put it in order

Before you write anything, put these lines back in the right order. Click a line to move it up one step. This support step is easier than writing code from scratch, and it is here to make the last example stick.

Data Flow

A literal value is created; the compiler records its type annotation; later assignments are checked against that type.
1 Write a literal (e.g. 42) -> compiler infers number
↓
2 Attach or accept a type annotation -> records the contract
↓
3 Assign a new value -> compiler checks it matches
↓
4 Mismatch -> compile error before the app ever runs
Why this works
Why annotate at all?

JavaScript is dynamically typed: a variable's type can change at runtime. TypeScript's annotations let the compiler find mistakes before the code runs:

const price: number = 10;
const total = price + "USD";   // type error: string + number

Without the annotation, JavaScript would happily produce the string "10USD": a silent bug the compiler flags as a type error.

The any escape hatch

any disables all checking for a variable. It's tempting but throws away every safety benefit:

let data: any = "hello";
data = 42;           // allowed with any - dangerous
data.doSomething();  // allowed with any - likely a bug

Reserve any for truly unknown data (old JS libraries, JSON.parse output) and narrow it to a real type as soon as possible with a type guard or cast.

Examples

Declaring typed variables

Declaring typed variables

TypeScript adds a : type annotation after the variable name:

const name: string = "Ada";
const age: number = 30;
const active: boolean = true;

These annotations are checked at compile time and erased in the emitted JavaScript, they exist only to catch bugs early.

Why it works: the compiler understands the string, number, and boolean types and rejects assignments of the wrong type.

The number, bigint, and string families

Numeric types

const whole: number = 42;
const huge: bigint = 9007199254740991n;
const label: string = "text";
const quoted: string = `template`;

number covers both integers and floats (TypeScript has no separate int type). Use bigint for values larger than Number.MAX_SAFE_INTEGER. Strings can use single, double, or backtick quotes.

TypeScript's inferred types

Let the compiler infer

const x = 10;        // x is inferred as number
const y = "hi";      // y is inferred as string

If you omit the annotation, TypeScript infers the type from the initial value. This keeps code concise while still giving you full type safety.

Words this lesson uses

Each one is defined here on this site. Open the entry for the full definition and the other words it points at.

Next Lesson
Arrays and Tuples
Arrays and Tuples →