Surya JS Journey
Learn JavaScript through concepts, code, and guided practice.
A focused workspace for concept study, interactive examples, visual explanations, and challenge solving.
Hoisting
Hoisting describes how JavaScript processes declarations before executing code line by line.
Before JavaScript starts running a scope, it registers declarations. Function declarations are available immediately, while `var` declarations are initialized with `undefined` until assignment. `let` and `const` are also hoisted, but they remain inaccessible inside the temporal dead zone until their declaration is evaluated.
Explanation
Before JavaScript starts running a scope, it registers declarations. Function declarations are available immediately, while `var` declarations are initialized with `undefined` until assignment. `let` and `const` are also hoisted, but they remain inaccessible inside the temporal dead zone until their declaration is evaluated.
Key Points
- Function declarations can be called before they appear in the file.
- `var` is hoisted and initialized with `undefined`.
- `let` and `const` are hoisted too, but they are not usable before declaration.
Common Mistakes
- Thinking hoisting moves code physically upward.
- Expecting `let` and `const` to behave like `var`.
- Confusing function declarations with function expressions assigned to variables.
Practice Workspace
hoisting.js
Edit the code, run it in the browser, and inspect the console output below. Reset restores the original snippet for this page.
Editor
8 lines
Output
0 entries
Mode
practice
Workspace Notes
Changes stay local until you run the code. Reset restores the original snippet immediately for another pass.
Editor Actions
Use the editor to explore the example, then run it to inspect the console.
Run the code to see output here.
Expected Output
undefined
Hoisted functionContinue in Playground
Open this concept example in the shared playground to keep experimenting without leaving the broader workspace flow.
Open in Playground