Course outline · 0% complete

0/29 lessons0%

Course overview →

Dynamic types and typeof

lesson 2-2 · ~8 min · 5/29

Types live on values, not variables

Types are worth learning early because most beginner JavaScript bugs are type bugs: a number that is secretly the string "5", or a variable that is undefined because nothing was ever assigned to it. Knowing the six common types below, and how to check them, turns hours of confusion into seconds of diagnosis.

Like Python, JavaScript is dynamically typed. A variable can hold a number now and a string later, because the type belongs to the value currently inside, not to the name.

The types you will use constantly:

TypeExample valuesPython cousin
number42, 3.5int and float
string"hi"str
booleantrue, falseTrue, False
undefinedundefined(no direct match)
nullnullNone
object{...}, [...]dict, list

Two things jump out of that table. Booleans are lowercase: true, not True. And there are two separate "nothing" values. undefined means no value was ever put here, which is what a declared but unassigned variable holds. null means a person deliberately stored nothing here, the way Python's None is used.

Asking a value its type

Python has type(x). JavaScript has the typeof operator, which gives back the type name as a string:

typeof 42        // "number"
typeof "42"      // "string"
typeof true      // "boolean"
typeof undefined // "undefined"

One famous oddity you will eventually meet: typeof null answers "object". That is a bug from 1995 that can never be fixed without breaking the web. To test for null, compare directly: x === null.

One variable, two different types

The type follows the value, and this program makes that visible. The variable x starts out holding a number, then the very same variable is given a string, and typeof reports something different each time.

let x = 42;
console.log(typeof x);

x = "forty-two";
console.log(typeof x);

console.log(typeof true);

let unset;
console.log(typeof unset);

Output

number
string
boolean
undefined

Nothing about x was redeclared between the first and second check. Reassigning it was enough to change what typeof x reports, which is the whole meaning of dynamic typing. The last pair of lines shows the other case worth recognizing: let unset; with no = creates the name but stores nothing in it, so its type is undefined.

Checking the type of three constants

Three values of three different types, each declared with const because none of them will be reassigned, and each one passed through typeof.

const pi = 3.14;
const language = "JavaScript";
const learning = true;

console.log(typeof pi);
console.log(typeof language);
console.log(typeof learning);

Output

number
string
boolean

typeof pi reports number even though 3.14 has a decimal point, because there is no separate float type to report. typeof language reports string because the value is wrapped in quotes. And typeof learning reports boolean because true is a real keyword here, not a name.

Telling undefined apart from null

The two "nothing" values arise in different ways, and this program produces one of each. nickname is declared with let and no value at all, so JavaScript fills it with undefined. middleName is deliberately set to null by the programmer to record that there is no middle name.

let nickname;
console.log(typeof nickname);
const middleName = null;
console.log(middleName === null);

Output

undefined
true

Writing let nickname; with no = is what leaves the variable undefined, and typeof names that state directly. The second check uses === null rather than typeof, and for a good reason: typeof null answers "object", a bug from JavaScript's first week that can never be fixed without breaking existing websites. Comparing against null with === sidesteps it entirely.

Why typeof "3.14" reports a string

console.log(typeof "3.14") prints string. The quotes decide the type, no matter which characters sit between them, so "3.14" is text that merely looks like a number.

This matters far beyond a curiosity, because values arriving from outside your program (form fields, files, network responses) arrive as strings. A price read as "3.14" will not add up the way you expect until it is converted, and lesson 8-2 covers the conversion functions that do that job. It is also worth noting that JavaScript would never have answered float here in any case, since the only numeric type in the language is number.