Basic types
A type annotation labels a variable's box with the kind of value it may hold. Step through a six-line program as "Mia" goes into a string box, 12 into a number box, true into a boolean box and a list into a number[] box that grows, then watch tsc refuse the string "twelve" in a number box with error TS2322, before anything runs.
5 quick questions
Pick an answer to see why. Your score saves with your progress.
01In let age: number = 12;, what does : number do?
A type annotation, written after a colon, says which kind of value the variable may hold. age can get new values, but each must be a number.
02Which type do you use for 12.5 in TypeScript?
JavaScript has one kind of number, so TypeScript has one type for all of them: number covers 12, -3 and 12.5 alike. There is no int or float.
03What can a boolean hold?
boolean has exactly two values, true and false. Write the type in lowercase: boolean, not Boolean.
04scores has type number[]. Which line does tsc reject?
number[] is a list whose items are all numbers. "A" is a string, so tsc reports error TS2345: Argument of type 'string' is not assignable to parameter of type 'number'.
05After let age: number = 12;, what happens with age = "twelve";?
A variable's type never changes. tsc reports: Type 'string' is not assignable to type 'number'. It finds this before anything runs.
Glossary
- Variable
- A named box that holds a value, made with let. Its value can change; in TypeScript its type cannot.
- Type annotation
- A type written after a name and a colon, like : string in let user: string, saying what the box may hold.
- string
- The type for text, written in quotes: "Mia", "" or "Hello, world!".
- number
- The type for every number, whole or decimal: 12, -3, 12.5. TypeScript has no separate int or float.
- boolean
- The type with only two values: true and false.
- Array type
- A list type such as number[] (also written Array<number>): every item must be a number.
- any
- A special type that switches the check off for a variable. An escape hatch to avoid while learning.
- TS2322
- tsc's error code for putting a value of one type into a place that needs another, such as a string into a number variable.
Notes and sources
- There is also a type called any. It switches the check off for that box, so any value goes in. It is an escape hatch; avoid it while you learn.
- You can often leave the label off: let age = 12 still makes age a number, because tsc works it out from the value. The next lesson is about this.
- tsc 5.9 with no settings writes var instead of let in the JavaScript file, because its default target is an old version of JavaScript. The labels are removed either way.
- The first box is called user, not name: a top-level variable called name clashes with the browser's built-in window.name in tsc's default setup.
- TypeScript Handbook: Everyday Types (string, number, boolean, arrays, any, annotations)
- TypeScript Handbook: The Basics (static type checking, erased types)
- TypeScript Handbook: TypeScript for the New Programmer
- MDN: Number (JavaScript's single number type)
- MDN: Array.prototype.push()
- MDN Glossary: Boolean
Quiz Unlocks after the last step.