All Visualizers

JavaScript Visualizer — Basics to Advanced

Complete JS learning path: foundations, engine internals, execution model, event loop, closures, async, memory, ES6+, design patterns, FP, OOP, performance & security

Variable Declarations: var vs let vs const

var

Scope: Function

Hoisting: undefined

Reassign: ✓

let

Scope: Block

Hoisting: TDZ

Reassign: ✓

const

Scope: Block

Hoisting: TDZ

Reassign: ✗

1

var Declaration

Function-scoped, hoisted with undefined, can be re-declared

Hoisted to top of function (or global)

Initialized as undefined during creation phase

Can be re-declared in same scope

No block scoping — leaks out of if/for blocks

2

let Declaration

Block-scoped, hoisted but in TDZ (Temporal Dead Zone)

3

const Declaration

Block-scoped, must be initialized, cannot be reassigned

4

Hoisting Behavior

All declarations are processed before execution begins

5

Temporal Dead Zone

The period between hoisting and actual declaration of let/const

🎯 Interview Questions

Q1: What is the difference between var, let, and const?

Q2: What is hoisting? How does it differ for var vs let/const?

Q3: What is the Temporal Dead Zone (TDZ)?

Q4: Can you modify an object declared with const?

Q5: What happens if you declare a var inside a for block?

Q6: Why is let preferred over var in modern JavaScript?

Q7: What is variable shadowing?

Q8: Explain the output: console.log(x); let x = 5;

🌍 Real-World Use Cases

• const for API endpoints, configuration objects, DOM references

• let for loop counters, conditional assignments, accumulators

• var is avoided in modern code — legacy codebases only

• const with destructuring for clean imports/exports

• let in for loops ensures proper closure behavior