Skip to main content
โšก Calmops

JavaScript Data Types Fundamentals

JavaScript Data Types Fundamentals

JavaScript has two categories of data types: primitives and objects. Understanding them is essential for writing correct code.

Primitive Data Types

Primitives are immutable values that are not objects. There are 7 primitive types:

1. Number

Represents both integers and floating-point numbers:

const integer = 42;
const decimal = 3.14;
const negative = -10;
const scientific = 1.5e2; // 150

console.log(typeof 42); // "number"

Special number values:

const infinity = Infinity;
const negInfinity = -Infinity;
const notANumber = NaN; // "Not a Number"

console.log(typeof NaN); // "number" (confusing, but true!)

2. String

Represents text:

const single = 'Hello';
const double = "World";
const template = `Hello, ${name}!`; // Template literal

console.log(typeof "text"); // "string"

3. Boolean

Represents true or false:

const isActive = true;
const isComplete = false;

console.log(typeof true); // "boolean"

4. Undefined

A variable declared but not assigned:

let x;
console.log(x); // undefined
console.log(typeof undefined); // "undefined"

5. Null

Represents intentional absence of value:

const empty = null;
console.log(typeof null); // "object" (this is a JavaScript quirk!)

6. Symbol

Unique identifiers (advanced):

const id1 = Symbol('id');
const id2 = Symbol('id');

console.log(id1 === id2); // false (each symbol is unique)
console.log(typeof Symbol('id')); // "symbol"

7. BigInt

For very large integers:

const big = 9007199254740991n; // Note the 'n' suffix
console.log(typeof 123n); // "bigint"

Objects

Objects are collections of key-value pairs. Everything that’s not a primitive is an object.

Object Literal

const person = {
    name: "Alice",
    age: 30,
    city: "New York"
};

console.log(person.name); // "Alice"
console.log(person['age']); // 30
console.log(typeof person); // "object"

Arrays

Arrays are ordered collections:

const colors = ["red", "green", "blue"];
console.log(colors[0]); // "red"
console.log(colors.length); // 3
console.log(typeof colors); // "object" (arrays are objects!)

Functions

Functions are also objects:

function greet(name) {
    return `Hello, ${name}!`;
}

console.log(typeof greet); // "function"
console.log(greet("Alice")); // "Hello, Alice!"

Dates

const now = new Date();
console.log(typeof now); // "object"
console.log(now.getFullYear()); // 2025

Type Checking

typeof Operator

console.log(typeof 42); // "number"
console.log(typeof "text"); // "string"
console.log(typeof true); // "boolean"
console.log(typeof undefined); // "undefined"
console.log(typeof Symbol('id')); // "symbol"
console.log(typeof 123n); // "bigint"
console.log(typeof {}); // "object"
console.log(typeof []); // "object"
console.log(typeof null); // "object" (quirk!)
console.log(typeof function(){}); // "function"

instanceof Operator

const arr = [1, 2, 3];
console.log(arr instanceof Array); // true
console.log(arr instanceof Object); // true

const date = new Date();
console.log(date instanceof Date); // true

Array.isArray()

console.log(Array.isArray([1, 2, 3])); // true
console.log(Array.isArray("not an array")); // false

Type Coercion

JavaScript automatically converts types in certain situations:

String Coercion

console.log("5" + 3); // "53" (number converted to string)
console.log("5" - 3); // 2 (string converted to number)

Boolean Coercion

if ("text") {
    console.log("truthy"); // Runs - non-empty strings are truthy
}

if (0) {
    console.log("never runs"); // 0 is falsy
}

Falsy Values

const falsy = [false, 0, "", null, undefined, NaN];

falsy.forEach(value => {
    if (!value) {
        console.log(`${value} is falsy`);
    }
});

Truthy Values

Everything else is truthy:

console.log(Boolean(1)); // true
console.log(Boolean("text")); // true
console.log(Boolean([])); // true (even empty arrays!)
console.log(Boolean({})); // true (even empty objects!)

Practical Examples

Checking for Empty Values

const value = "";

// Check for empty string
if (value === "") {
    console.log("Empty string");
}

// Check for falsy
if (!value) {
    console.log("Falsy value");
}

Type Conversion

// String to number
const num = Number("42");
console.log(num); // 42

// Number to string
const str = String(42);
console.log(str); // "42"

// To boolean
const bool = Boolean(1);
console.log(bool); // true

Checking Object Types

function checkType(value) {
    if (value === null) return "null";
    if (value === undefined) return "undefined";
    if (Array.isArray(value)) return "array";
    return typeof value;
}

console.log(checkType(42)); // "number"
console.log(checkType([1, 2])); // "array"
console.log(checkType(null)); // "null"

Common Mistakes

Confusing null and undefined

let x; // undefined - declared but not assigned
let y = null; // null - explicitly set to nothing

console.log(x == y); // true (loose equality)
console.log(x === y); // false (strict equality)

typeof null returns “object”

console.log(typeof null); // "object" (this is a bug in JavaScript!)

// Check for null properly
if (value === null) {
    console.log("It's null");
}

Arrays are objects

const arr = [1, 2, 3];
console.log(typeof arr); // "object"
console.log(Array.isArray(arr)); // true (use this to check for arrays)

Official Documentation

External Resources

Summary

  • Primitives: number, string, boolean, undefined, null, symbol, bigint
  • Objects: everything else (objects, arrays, functions, dates)
  • typeof checks type but has quirks (null, arrays)
  • Type coercion happens automatically; understand falsy/truthy values
  • Use strict equality (===) to avoid unexpected coercion

Next Steps

  1. JavaScript Operators: Arithmetic, Logical, Comparison
  2. Type Coercion and Type Conversion
  3. JavaScript Objects: Creation, Properties, Methods
  4. JavaScript Arrays: Creation, Indexing, Methods

Comments