Primitive data types in Javascript - Step-by-Step Execution

Concept Flow - Primitive data types

Start

↓

Declare variable

↓

Assign primitive value

↓

Use value in code

↓

Value stored directly

↓

End

This flow shows how a variable is declared and assigned a primitive value, which is stored directly in memory.

Execution Sample

Javascript

let age = 25;
let name = "Alice";
let isStudent = true;
console.log(age, name, isStudent);

This code declares variables with primitive data types and prints their values.

Execution Table

Step	Action	Variable	Value Assigned	Type	Output
1	Declare and assign	age	25	number
2	Declare and assign	name	"Alice"	string
3	Declare and assign	isStudent	true	boolean
4	Print values	age, name, isStudent	25, "Alice", true	number, string, boolean	25 Alice true
5	End

💡 All variables assigned primitive values and printed; execution ends.

Variable Tracker

Variable	Start	After Step 1	After Step 2	After Step 3	Final
age	undefined	25	25	25	25
name	undefined	undefined	"Alice"	"Alice"	"Alice"
isStudent	undefined	undefined	undefined	true	true

Key Moments - 3 Insights

Why does the variable 'age' hold the value 25 directly, not a reference?

Because 'age' is assigned a primitive number, which JavaScript stores directly in the variable, as shown in execution_table step 1.

What happens if we change 'name' after assignment?

Changing 'name' will replace the stored string value directly, without affecting other variables, since primitives are stored by value (see variable_tracker).

Why does console.log print the actual values, not memory addresses?

Primitive types hold actual values, so console.log outputs these values directly, as seen in execution_table step 4.

Visual Quiz - 3 Questions

Look at the execution_table at step 2. What type is the variable 'name' assigned?

A boolean

B number

C string

D object

💡 Hint

Check the 'Type' column in execution_table row for step 2.

At which step are all variables assigned their primitive values?

A Step 1

B Step 3

C Step 2

D Step 4

💡 Hint

Look at execution_table rows where variables get assigned values.

If we change 'isStudent' to false after step 3, what will variable_tracker show for 'isStudent' after that?

A false

B undefined

C true

D null

💡 Hint

Primitive variables hold values directly; changing them updates the stored value (see variable_tracker).

Concept Snapshot

Primitive data types in JavaScript include number, string, boolean, null, undefined, symbol, and bigint.
They store actual values directly in variables.
Assigning or copying primitives copies the value, not a reference.
Primitives are immutable; changing a variable replaces its value.
Use primitives for simple data like numbers, text, and true/false.

Full Transcript

This lesson shows how JavaScript handles primitive data types. Variables like age, name, and isStudent are declared and assigned primitive values: number, string, and boolean. Each variable stores its value directly, not a reference. When we print these variables, the actual values appear. The execution table traces each step, showing assignments and output. The variable tracker shows how values change after each step. Key moments clarify why primitives hold values directly and how changing them works. The quiz tests understanding of types, assignment steps, and value changes. Remember, primitives are simple, direct values in JavaScript.

Practice

1. Which of the following is NOT a primitive data type in JavaScript?

easy

A. object

B. boolean

C. string

D. number

Solution

1. Step 1: Recall JavaScript primitive types

   JavaScript primitive types include string, number, boolean, undefined, null, symbol, and bigint.

2. Step 2: Identify non-primitive types

   Object is not a primitive type; it is a complex data type used to store collections.

3. Final Answer:

   object -> Option A

4. Quick Check:

   Primitive types exclude objects [OK]

Hint: Remember: objects are NOT primitives, others are [OK]

Common Mistakes:

• Confusing object with primitive types
• Thinking null is an object
• Mixing symbol with object

2. Which of the following is the correct way to declare a variable with a string primitive in JavaScript?

easy

A. let name = John;

B. let name = 'John';

C. let name = "John;

D. let name = `John;

Solution

1. Step 1: Check string declaration syntax

   Strings must be enclosed in matching quotes: single ('') or double ("") or backticks (``).

2. Step 2: Validate each option

   let name = 'John'; uses single quotes correctly. let name = John; lacks quotes. Options C and D have unclosed quotes.

3. Final Answer:

   let name = 'John'; -> Option B

4. Quick Check:

   Strings need matching quotes [OK]

Hint: Strings always need matching quotes around text [OK]

Common Mistakes:

• Missing quotes around string
• Using mismatched quotes
• Forgetting semicolon (optional but good)

3. What will be the output of the following code?

console.log(typeof 123);
console.log(typeof 'hello');
console.log(typeof true);

medium

A. "number", "string", "boolean"

B. "Number", "String", "Boolean"

C. "num", "str", "bool"

D. "integer", "text", "bool"

Solution

1. Step 1: Understand typeof operator

   typeof returns the type of a value as a lowercase string like "number", "string", or "boolean".

2. Step 2: Check each console.log output

   typeof 123 is "number", typeof 'hello' is "string", typeof true is "boolean".

3. Final Answer:

   "number", "string", "boolean" -> Option A

4. Quick Check:

   typeof returns lowercase type names [OK]

Hint: typeof returns lowercase type names as strings [OK]

Common Mistakes:

• Capitalizing type names
• Using short forms like 'num'
• Confusing typeof output with values

4. Find the error in this code snippet:

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

medium

A. null is not a valid value

B. typeof null returns 'null'

C. typeof null returns 'object' which is confusing

D. No error, code works fine

Solution

1. Step 1: Understand typeof null behavior

   typeof null returns "object" due to a historical JavaScript bug.

2. Step 2: Identify confusion

   This is confusing because null is a primitive but typeof shows "object".

3. Final Answer:

   typeof null returns 'object' which is confusing -> Option C

4. Quick Check:

   typeof null is 'object' (quirk) [OK]

Hint: Remember typeof null is 'object' due to JavaScript quirk [OK]

Common Mistakes:

• Expecting 'null' from typeof
• Thinking null is an object
• Assuming code throws error

5. You want to store a very large integer number beyond the safe integer limit in JavaScript. Which primitive type should you use?

hard

A. number

B. symbol

C. string

D. bigint

Solution

1. Step 1: Understand number limits in JavaScript

   The number type can safely represent integers only up to 2^53 - 1.

2. Step 2: Identify type for large integers

   bigint is designed to store integers larger than the safe limit without losing precision.

3. Final Answer:

   bigint -> Option D

4. Quick Check:

   Use bigint for very large integers [OK]

Hint: Use bigint for integers larger than safe number limit [OK]

Common Mistakes:

• Using number for very large integers
• Using string instead of bigint
• Confusing symbol with number types