📐
Advanced JavaScript

Scope & Hoisting

Variable Visibility Rules
💡 Scope ek building ke floors jaisa hai — ek floor ki cheezein (variables) sirf usi floor (aur uske andar wale rooms) se accessible hain, bahar se nahi. Hoisting ek "declarations pehle process ho jaati hain" quirk hai — jaise ek building ka blueprint pehle ban jaata hai, actual construction baad mein.

Scope decide karta hai KAHA se ek variable accessible hai — global scope (poore file mein), function scope (function ke andar), block scope (let/const ke liye, {} ke andar). Hoisting JavaScript ka behavior hai jaha var/function DECLARATIONS "upar move" ho jaate hain (technically, memory mein pehle allocate hote hain) — lekin let/const "Temporal Dead Zone" mein rehte hain.

console.log(x);   // undefined (var hoisted, lekin value nahi)
var x = 5;

// console.log(y);   // ReferenceError (TDZ — let hoisted hai lekin access nahi kar sakte)
let y = 5;

function outer() {
  let outerVar = "outer mein";
  function inner() {
    console.log(outerVar);   // accessible — scope chain ke through
  }
  inner();
}

if (true) {
  let blockScoped = "sirf yaha";
  var notBlockScoped = "poore function/global mein";
}
// console.log(blockScoped);   // ERROR — block ke bahar nahi
console.log(notBlockScoped);    // valid — var block-scope follow nahi karta
📐
Scope ek building ke floors jaisa hai — ek floor ki cheezein (variables) sirf usi floor (aur uske andar wale rooms) se accessible hain, bahar se nahi. Hoisting ek "declarations pehle process ho jaati hain" quirk hai — jaise ek building ka blueprint pehle ban jaata hai, actual construction baad mein.
1 / 2
⚡ Quick Recap
  • Scope = variable kaha accessible hai (global/function/block)
  • Hoisting = declarations "upar move" hote hain (var/function), let/const TDZ mein
  • Scope chain = inner functions outer ki variables access kar sakte hain
On this page (2 subtopics)

Function DECLARATIONS poori tarah hoisted hote hain (naam + body dono) — call before define kaam karta hai. Function EXPRESSIONS (const fn = function(){}) sirf variable hoisted hota hai, value nahi — TDZ/undefined follow karta hai.

sayHi();   // "Hi!" — kaam karta hai, function declaration hai
function sayHi() {
  console.log("Hi!");
}

// sayBye();   // ERROR — function expression, hoisted nahi hai body ke saath
const sayBye = function() {
  console.log("Bye!");
};
💡Tip: Ye farq samajhna zaroori hai debugging ke liye — "function X is not defined" jaisa error aksar iss confusion se aata hai ki function expression ko declaration jaisa treat kar liya.

ES6 modules/block-scoping se pehle, IIFE (Immediately Invoked Function Expression) variables ko global scope "pollute" karne se bachने ka standard tareeka tha — ek function scope create karke, sab kuch usके andar isolate karna.

(function() {
  var privateVar = "Global scope mein nahi jaayega";
  console.log(privateVar);
})();

// console.log(privateVar);   // ERROR — IIFE ke bahar accessible nahi
💡Tip: Modern JavaScript mein ES6 modules (har file apna khud ka scope hai) aur block-scoping (let/const) ne IIFEs ki zaroorat kaafi kam kar di hai — lekin purane code mein bahut milega, pattern samajhna zaroori hai.