JavaScript Data Types

Back in JS Types you met the basic kinds of values. Now that you have used strings, numbers, arrays, objects, Maps, and more, this section goes deeper: exactly how many types there are, the one big split that divides them, and the tools for telling them apart reliably.

// There Are Exactly Eight

Seven primitives, plus object. Every value in JavaScript is one of these eight. Arrays, functions, dates, Maps, Sets, and regexes are all kinds of object, not separate types.

// One of Each

Here is a declaration for every type, checked with typeof (every detail is in JS typeof):

const length = 16;                            // number
const weight = 7.5;                           // number (there is no separate decimal type)
const big = 1234567890123456789012345n;       // bigint
const color = "Yellow";                       // string
const done = false;                            // boolean
let nothingYet;                               // undefined
const empty = null;                            // null
const id = Symbol();                          // symbol
const person = { firstName: "John", lastName: "Doe" };   // object
const cars = ["Saab", "Volvo", "BMW"];         // object (an array)
const date = new Date("2022-03-25");          // object (a Date)

console.log(typeof length, typeof big, typeof color, typeof done);
console.log(typeof nothingYet, typeof empty, typeof id, typeof person, typeof cars, typeof date);

Two surprises in the second line: typeof null says "object" (a famous bug, see JS typeof), and arrays and dates report "object" because they are objects.

// The Big Split: Primitives vs Objects

The single most important idea in this section. Primitives and objects behave differently when you copy, compare, and change them:

// Primitives: copied by VALUE
let a = 5;
let b = a;       // b gets its own 5
b = 10;
console.log(a);  // 5  (a is unaffected)

// Objects: copied by REFERENCE
const x = { n: 5 };
const y = x;     // y points to the SAME object
y.n = 10;
console.log(x.n); // 10 (x sees the change)

"hi" === "hi"            // true   same value
[1, 2] === [1, 2]        // false  two different arrays

// Why Types Matter

The computer has to know a value's type to know what an operator should do. What is 16 + "Volvo"? JavaScript's rule: if either side of + is a string, the other side becomes a string and the two are joined:

console.log(16 + "Volvo");
console.log("Volvo" + 16);
console.log(16 + 4 + "Volvo");     // left to right: 16 + 4 happens first
console.log("Volvo" + 16 + 4);     // a string first, so everything is joined

+ works left to right. In the third line, 16 + 4 is plain math (20) before the string shows up. In the fourth, the string comes first, so 16 and then 4 are each joined as text. These automatic conversions are called type coercion, and they get their own lesson in Part 2 of this section (JS Type Coercion).

// Dynamic Typing, Revisited

Variables do not have types; values do. The same variable can hold a string now and a number later:

let data = "42";      // string
data = Number(data);  // number
data = [data];        // object (an array)

That flexibility is why the tools in this section matter: at any moment, you may need to check what kind of value you are actually holding.

// Telling Types Apart

typeof "hi"              // "string"   works well for most primitives
typeof null              // "object"   famous mistake: check with === null
typeof [1, 2]            // "object"   use Array.isArray
Array.isArray([1, 2])     // true
new Date() instanceof Date // true       which constructor made it

// The Road Ahead

// Quick Check

console.log(1 + 2 + "3" + 4 + 5);

// Try It

▶ Open Playground

1. Click Open Playground and run it: one example of each of the eight types. Which result looks wrong, and why?
2. Copy a number into a second variable and change it; then do the same with an object's property
3. Compare two identical arrays with ===, then two identical strings
4. Write a function that receives an array and pushes to it, and show the original array changed