Let’s now explore JavaScript Primitives in full depth — this is one of the most important topics to understand how JavaScript behaves under the hood, especially when you start working with memory, references, and performance later on.

⚡ JavaScript Primitive Data Types (Detailed + Practical Guide)

🧠 1. What Are Primitives?

A primitive is a single immutable value — not an object, and has no methods or properties (although JS temporarily wraps them when you use methods).

✅ Characteristics:

• Stored by value (not by reference)
• Immutable (cannot be changed once created)
• Copied when assigned to a new variable
• 7 types in total

⚙️ 2. The 7 Primitive Data Types in JavaScript

🧩 3. Primitive Type Details

1️⃣ Number

Represents both integers and floating points.
JS has only one numeric type (64-bit floating point).

let age = 25;
let price = 19.99;
let infinity = Infinity;
let notANumber = NaN;

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

🧠 Note:

typeof NaN; // "number"  (weird but true)
0.1 + 0.2 === 0.3; // false due to floating-point precision

✅ Use Number.isNaN() to check if a value is NaN.

2️⃣ String

Represents text. Strings are immutable.

let name = "Rajeev";
let msg = `Hello, ${name}!`; // Template literal

console.log(msg);
console.log(name[0]); // 'R'

🧠 Even though strings are immutable, JS temporarily wraps them with a String object when you access properties or methods:

console.log(name.length);      // 6
console.log(name.toUpperCase()); // RAJEEV

3️⃣ Boolean

Logical true/false values used in conditions.

let isActive = true;
let isOver18 = age > 18; // true
console.log(typeof isOver18); // "boolean"

Falsy values in JS (evaluated as false):

false, 0, "", null, undefined, NaN

Everything else is truthy.

4️⃣ Undefined

A variable is undefined when it is declared but not assigned.

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

🧠 Also, a function that returns nothing implicitly returns undefined.

5️⃣ Null

Represents intentional absence of any object value.

let user = null;
console.log(typeof user); // "object" 🤯 (a JS legacy bug)

✅ Use user === null for correct comparison.

6️⃣ Symbol (Unique & Immutable)

Introduced in ES6.

Each symbol is guaranteed to be unique, even with the same description.

let sym1 = Symbol('id');
let sym2 = Symbol('id');
console.log(sym1 === sym2); // false

Use case: hidden or protected object keys.

const id = Symbol('id');
let user = { name: "Rajeev", [id]: 101 };
console.log(user[id]); // 101

7️⃣ BigInt

Introduced in ES2020 to handle numbers larger than 2^53 - 1.

let big = 123456789012345678901234567890n;
console.log(big + 2n); // 123456789012345678901234567892n
console.log(typeof big); // "bigint"

❌ You cannot mix BigInt and Number directly:

console.log(big + 10); // TypeError

⚖️ 4. Copy by Value (Primitive Behavior)

When assigning a primitive variable to another, the value is copied, not referenced.

let a = 10;
let b = a;
b = 20;

console.log(a); // 10 (unchanged)
console.log(b); // 20

🔍 5. Checking Types

typeof 123;          // "number"
typeof "Hello";      // "string"
typeof true;         // "boolean"
typeof undefined;    // "undefined"
typeof null;         // "object" (bug)
typeof Symbol();     // "symbol"
typeof 123n;         // "bigint"

🧠 6. Type Conversion

Explicit:

Number("5")       // 5
String(123)       // "123"
Boolean("")       // false
Boolean("Hi")     // true

Implicit (Type Coercion):

"5" + 5           // "55"
"5" - 1           // 4
true + true       // 2
false + 10        // 10

🧩 7. Practice Challenge – “Type Tester”

Try this in your browser console 👇

let value = prompt("Enter something:");
alert(`Value: ${value}, Type: ${typeof eval(value)}`);

👉 Try entering:

• "Hello"
• 5
• true
• null
• 123n
• Symbol('a') (use console, not prompt)
  See how each type is detected.

🧾 Summary Table

🔥 Quick Test Yourself

✅ What’s the output?

console.log(typeof NaN);  
console.log(typeof null); 
console.log(typeof 123n);
console.log(Symbol("a") === Symbol("a"));

"number"
"object"
"bigint"
false