Data Types

JavaScript has eight data types — seven primitive types and one complex type (object). Understanding types is fundamental to JavaScript because the language is dynamically typed — variables can hold any type, and types can change at runtime. This flexibility is powerful but also a source of bugs if you do not understand how JavaScript handles types behind the scenes. In this lesson you will learn all eight types and how to detect and work with them reliably.

The Eight JavaScript Data Types #

Checking Types with typeof #

Truthy and Falsy Values #

Basic Example #

// ── The 7 primitive types ─────────────────────────────────────────────────
const greeting   = 'Hello, World!';     // string
const age        = 28;                  // number
const price      = 9.99;               // number (no separate float type)
const isActive   = true;               // boolean
const nothing    = null;               // null
let   notDefined;                      // undefined (no assignment)
const bigNum     = 9007199254740992n;  // bigint (note the n suffix)
const uid        = Symbol('userId');   // symbol — always unique

// ── typeof detection ─────────────────────────────────────────────────────
console.log(typeof greeting);    // 'string'
console.log(typeof age);         // 'number'
console.log(typeof isActive);    // 'boolean'
console.log(typeof nothing);     // 'object' ← the famous bug (it IS null)
console.log(typeof notDefined);  // 'undefined'
console.log(typeof bigNum);      // 'bigint'
console.log(typeof uid);         // 'symbol'
console.log(typeof {});          // 'object'
console.log(typeof []);          // 'object' — use Array.isArray()

// Correct null check
console.log(nothing === null);    // true ✅
console.log(Array.isArray([]));   // true ✅

// ── Special number values ─────────────────────────────────────────────────
console.log(1 / 0);              // Infinity
console.log(-1 / 0);             // -Infinity
console.log(0 / 0);              // NaN
console.log(Number.isNaN(0/0));  // true — use Number.isNaN(), not isNaN()

// ── Truthy / falsy in action ──────────────────────────────────────────────
const values = [0, '', null, undefined, NaN, false, [], {}, 'hello', 42];
values.forEach(v => {
  console.log(`${String(v).padEnd(10)} → ${v ? 'truthy' : 'falsy'}`);
});
// 0          → falsy
// ''         → falsy
// null       → falsy
// undefined  → falsy
// NaN        → falsy
// false      → falsy
// []         → truthy   ← surprises beginners!
// {}         → truthy   ← surprises beginners!
// hello      → truthy
// 42         → truthy

// ── Dynamic typing — types can change ────────────────────────────────────
let dynamic = 42;
console.log(typeof dynamic);  // 'number'
dynamic = 'now a string';
console.log(typeof dynamic);  // 'string'
dynamic = { key: 'value' };
console.log(typeof dynamic);  // 'object'

How It Works #

Step 1 — Primitives Are Stored by Value #

When you assign a primitive to a variable, the actual value is stored directly in the variable. Copying a primitive copies the value: let b = a creates a completely independent copy. Changing b has no effect on a.

Step 2 — Objects Are Stored by Reference #

Objects (including arrays and functions) are stored by reference — the variable holds a pointer to the location in memory where the object lives. Copying an object variable copies the reference, not the object. Two variables pointing to the same object means changing one changes the other.

Step 3 — NaN Is a Number Type #

NaN stands for “Not a Number” — but typeof NaN is 'number'. It is the result of invalid arithmetic: 0/0, parseInt('hello'), Math.sqrt(-1). NaN is the only value in JavaScript not equal to itself: NaN === NaN is false. Always use Number.isNaN() to check for it.

Step 4 — JavaScript Is Dynamically Typed #

Unlike Java or TypeScript, JavaScript does not enforce types on variables. A variable can hold a string, then a number, then an object — the type is determined at runtime by whatever value is currently stored. This is convenient but requires careful attention to avoid type-related bugs.

Step 5 — Falsy Values Are the Six Exceptions #

In a boolean context (like an if condition), JavaScript converts any value to true or false. Only six values are falsy: false, 0, '', null, undefined, and NaN. Everything else — including empty arrays and empty objects — is truthy.

Real-World Example: Form Input Validator #

// form-validator.js

function validateField(name, value) {
  // Type guard — ensure we have a string
  if (typeof value !== 'string') {
    return { valid: false, error: `${name} must be a string` };
  }

  const trimmed = value.trim();

  // Falsy check — empty string is falsy
  if (!trimmed) {
    return { valid: false, error: `${name} is required` };
  }

  return { valid: true, value: trimmed };
}

function validateAge(value) {
  const num = Number(value);

  // NaN check
  if (Number.isNaN(num)) {
    return { valid: false, error: 'Age must be a number' };
  }
  if (!Number.isInteger(num) || num < 0 || num > 120) {
    return { valid: false, error: 'Age must be a whole number between 0 and 120' };
  }
  return { valid: true, value: num };
}

function validateForm(data) {
  const errors = [];

  // null / undefined check for required fields
  if (data.name == null) {   // catches both null and undefined
    errors.push('name field is missing');
  } else {
    const nameResult = validateField('Name', data.name);
    if (!nameResult.valid) errors.push(nameResult.error);
  }

  const ageResult = validateAge(data.age);
  if (!ageResult.valid) errors.push(ageResult.error);

  return { valid: errors.length === 0, errors };
}

// Tests
console.log(validateForm({ name: 'Alice', age: '28' }));   // valid: true
console.log(validateForm({ name: '',      age: '28' }));   // Name is required
console.log(validateForm({ name: 'Bob',   age: 'abc' }));  // Age must be a number
console.log(validateForm({ name: null,    age: '25' }));   // name field is missing
console.log(validateForm({ age: '25' }));                  // name field is missing

Common Mistakes #

Mistake 1 — Using typeof to check for null #

❌ Wrong — typeof null returns ‘object’, not ‘null’:

if (typeof value === 'null') { ... }   // never true — typeof null is 'object'

✅ Correct — use strict equality for null checks:

if (value === null) { ... }            // correct
if (value == null) { ... }             // catches both null AND undefined

Mistake 2 — Treating empty array/object as falsy #

❌ Wrong — [] and {} are truthy, so this condition always runs:

const items = [];
if (!items) {
  console.log('No items'); // Never runs — [] is truthy!
}

✅ Correct — check the length for arrays, Object.keys() for objects:

if (items.length === 0) { console.log('No items'); } // correct

Mistake 3 — Using isNaN() instead of Number.isNaN() #

❌ Wrong — global isNaN() coerces its argument first, giving false positives:

isNaN('hello')         // true — 'hello' coerces to NaN first
isNaN(undefined)       // true — undefined coerces to NaN

✅ Correct — Number.isNaN() only returns true for actual NaN:

Number.isNaN('hello')   // false — 'hello' is a string, not NaN
Number.isNaN(NaN)       // true — this is actual NaN

▶ Try It Yourself

Quick Reference #