JavaScript typeof Operator

Check the data type of any variable or value

🔍 What is typeof?

The typeof operator returns a string indicating the type of a variable or expression. It's useful for checking data types before performing operations. 


// Basic typeof usage
let name = "John";
let age = 25;

console.log(typeof name);  // "string"
console.log(typeof age);   // "number"

Output:

typeof name: "string"

typeof age: "number"

typeof Return Values

🔤

"string"

For text values 

typeof "Hello" // "string"
🔢

"number"

For numeric values 

typeof 42 // "number"
✅

"boolean"

For true/false values 

typeof true // "boolean"
📦

"object"

For objects, arrays, null 

typeof {} // "object"

🔹 typeof with All Data Types

Here's how typeof works with different data types: 

// Primitive types
console.log(typeof "Hello");        // "string"
console.log(typeof 'World');        // "string"
console.log(typeof `Template`);     // "string"

console.log(typeof 42);             // "number"
console.log(typeof 3.14);           // "number"
console.log(typeof NaN);            // "number"
console.log(typeof Infinity);       // "number"

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

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

// Special cases
console.log(typeof null);           // "object" (this is a known quirk!)

// Non-primitive types
console.log(typeof {});             // "object"
console.log(typeof []);             // "object"
console.log(typeof new Date());     // "object"

console.log(typeof function(){});   // "function"

Output:

String values: "string"

Number values: "number"

Boolean values: "boolean"

undefined: "undefined"

null: "object" ⚠️

Objects/Arrays: "object"

Functions: "function"

🔹 Practical typeof Examples

Using typeof to check data types before operations: 

function processData(data) {
    if (typeof data === "string") {
        return data.toUpperCase();
    } else if (typeof data === "number") {
        return data * 2;
    } else if (typeof data === "boolean") {
        return !data;
    } else {
        return "Unknown data type";
    }
}

// Test the function
console.log(processData("hello"));     // "HELLO"
console.log(processData(5));           // 10
console.log(processData(true));        // false
console.log(processData([]));          // "Unknown data type"

Output:

processData("hello"): "HELLO"

processData(5): 10

processData(true): false

processData([]): "Unknown data type"

🔹 typeof Gotchas and Special Cases

Be aware of these special behaviors: 

// 1. null returns "object" (historical bug)
console.log(typeof null);              // "object"

// 2. Arrays are objects
console.log(typeof [1, 2, 3]);         // "object"

// 3. NaN is a number
console.log(typeof NaN);               // "number"

// 4. Functions are their own type
console.log(typeof alert);             // "function"

// 5. Undeclared variables
console.log(typeof undeclaredVar);     // "undefined"

// Better way to check for null
function isNull(value) {
    return value === null;
}

// Better way to check for arrays
function isArray(value) {
    return Array.isArray(value);
}

console.log(isNull(null));             // true
console.log(isArray([1, 2, 3]));       // true

Output:

typeof null: "object" ⚠️

typeof [1,2,3]: "object"

typeof NaN: "number"

isNull(null): true

isArray([1,2,3]): true

🔹 typeof in Conditional Statements

Common patterns using typeof for type checking: 

let userInput = "123";

// Check if it's a string before converting
if (typeof userInput === "string") {
    let number = parseInt(userInput);
    console.log("Converted to number:", number);
}

// Safe function call
function safeCall(fn) {
    if (typeof fn === "function") {
        fn();
    } else {
        console.log("Not a function!");
    }
}

safeCall(function() { console.log("Hello!"); });  // Calls function
safeCall("not a function");                       // Shows error message

// Check for undefined
let config;
if (typeof config === "undefined") {
    config = { theme: "light", lang: "en" };
}
console.log(config);

Output:

Converted to number: 123

Hello!

Not a function!

config: { theme: "light", lang: "en" }

🧠 Test Your Knowledge

What does typeof null return?