Variables & Data Types

How JavaScript stores and manages values. The foundation of everything.

Overview

Programs work by processing data. Variables store it.

Programs work by processing data. Data can be names, numbers, prices, dates, user input, settings, game scores, and much more.

To store and work with data, JavaScript uses variables — named containers that hold values which can be used later in a program.

NamesNumbersPricesDatesUser InputSettingsGame ScoresStates
// Values in JavaScript:
"Hello"    // string
42         // number
true       // boolean
null       // intentional empty
JavaScript automatically determines the type — this is called dynamic typing.

var, let & const

Three ways to declare variables. Only two you should use.

Use for values that will change.

ScopeBlock
Reassign
Redeclare
HoistedTDZ Error
let score = 0;
score = 10;     // ✓ can reassign
score = 25;     // ✓ works fine

// let score = 5; // ✗ Error: already declared

Best Practice

  • Use const by default
  • Use let only when you need to reassign
  • Avoid var — it has confusing scoping and hoisting

Primitive Data Types

JavaScript defines seven primitive types plus objects.

Number

Integers and floating-point values. JavaScript uses a single Number type for both.

let age = 25;
let price = 9.99;
let negative = -20;
let infinity = Infinity;
let notANumber = NaN;

console.log(typeof age);
"number"

💡 JavaScript numbers follow IEEE 754 double-precision format (64-bit).

TypeExampletypeof
Number42"number"
String"hello""string"
Booleantrue"boolean"
Undefinedundefined"undefined"
Nullnull"object" ⚠️
SymbolSymbol()"symbol"
BigInt123n"bigint"

Dynamic Typing

Variables can change types at any time.

JavaScript is a dynamically typed language. This means variables can hold different types of values without explicitly declaring their type.

The same variable can store a number, then a string, then a boolean — JavaScript won't complain.

let value = 10;
console.log(typeof value);

We start by storing a number. typeof confirms it's a "number".

💡 value currently holds: 10 (number)
1 / 5

✓ Advantages

  • Quick to write
  • Flexible
  • No type declarations
  • Great for prototyping

✗ Disadvantages

  • Runtime type errors
  • Harder to debug
  • No IDE autocompletion hints
  • Unexpected coercion

typeof Operator

Check what type a value is at runtime.

The typeof operator returns a string indicating the type of a value. It's a useful debugging tool.

typeof 42          // "number"
typeof "hello"     // "string"
typeof true        // "boolean"
typeof undefined   // "undefined"
typeof null        // "object" ← bug!
typeof Symbol()    // "symbol"
typeof 123n        // "bigint"
typeof {}          // "object"
typeof []          // "object"
typeof function(){} // "function"

Try it — typeof checker

typeof 42"number"

💡 Gotchas:typeof null returns "object" (historical bug), and typeof [] also returns "object". Use Array.isArray() to check for arrays.

Stack vs Heap

Where JavaScript stores your variables in memory.

📦 Stack

Primitives (fixed size)

  • Numbers
  • Strings
  • Booleans
  • undefined
  • null
  • Symbols
  • BigInts

🏗️ Heap

Objects (dynamic size)

  • Objects {}
  • Arrays []
  • Functions
  • Date
  • RegExp
  • Map / Set
// Primitives → copied by value
let a = 10;
let b = a;    // b gets its own copy
b = 20;
console.log(a); // still 10

// Objects → copied by reference
let obj1 = { x: 1 };
let obj2 = obj1;  // both point to same object
obj2.x = 99;
console.log(obj1.x); // 99!
a = 10, obj1.x = 99
StackHeap
Fixed sizeDynamic size
Fast accessSlower access
Copied by valueCopied by reference
Auto-cleaned (scope)Garbage collected

Exercises

Test your understanding.

Try it yourself
1.

What keyword should you use to declare a variable that won't change?

2.

What does this output?

let x = 5;
x = "hello";
typeof x;
3.

What is the typeof null?

4.

What does this output?

let a;
console.log(a);

Frequently Asked Questions

Common questions about variables and data types.