JavaScript: Scope & Hoisting Kya Hote Hain?

Scope in JavaScript

Scope ka matlab hai ek variable ya function ki accessibility – yaani woh code me kahaan tak available hai aur use kahan se access kiya ja sakta hai. Sahi scope ka use karna code ko clean aur error-free banata hai.

1. Global Scope

Jab aap koi variable function ke bahar declare karte hain, toh woh global scope me hota hai. Global variables ko program me kahin se bhi access kiya ja sakta hai.

var globalVar = "I am a global variable";

function testFunction() {
    console.log(globalVar); // Accessible inside function
}

testFunction(); // Output: "I am a global variable"
console.log(globalVar); // Accessible outside function also

2. Local or Function Scope

Jab aap koi variable kisi function ke andar `var`, `let`, ya `const` se declare karte hain, toh woh local/function scope me hota hai. Yeh sirf uss function ke andar hi accessible hota hai.

function myFunction() {
    var localVar = "I am a local variable";
    console.log(localVar); // Accessible inside function
}

myFunction(); // Output: "I am a local variable"
// console.log(localVar); // Uncaught ReferenceError: localVar is not defined

3. Block Scope (ES6)

ES6 me `let` aur `const` ke aane se block scope introduce hua. Iska matlab hai ki variable sirf uss block { ... } ke andar hi accessible hota hai jisme woh define kiya gaya hai.

{
    let blockVar = "I exist only inside this block";
    const alsoBlockVar = "Me too!";
    console.log(blockVar); // Accessible
}
// console.log(blockVar); // Uncaught ReferenceError: blockVar is not defined

Note: `var` keyword block scope follow nahi karta, isliye use avoid karna best practice hai.

Hoisting in JavaScript

Hoisting JavaScript ka ek behavior hai jisme variable aur function declarations ko unke scope ke top par move kar diya jaata hai, code execution se pehle.

Variable Hoisting

`var` se declare kiye gaye variables hoist hote hain aur unhe `undefined` value milti hai. `let` aur `const` bhi hoist hote hain, lekin unhe value assign hone se pehle access nahi kiya ja sakta (ise Temporal Dead Zone kehte hain).

// Hoisting with var
console.log(myVar); // Output: undefined
var myVar = "Hello";

// Hoisting with let
// console.log(myLet); // ReferenceError: Cannot access 'myLet' before initialization
let myLet = "World";

Function Hoisting

Function declarations poori tarah se hoist hoti hain, isliye aap unhe define karne se pehle bhi call kar sakte hain. Lekin, function expressions (jab function ko variable me store kiya jaata hai) hoist nahi hote.

// Function Declaration (Hoisted)
sayHello(); // Output: "Hello, world!"

function sayHello() {
    console.log("Hello, world!");
}

// Function Expression (Not Hoisted)
// greet(); // TypeError: greet is not a function (if var) or ReferenceError (if let/const)

var greet = function() {
    console.log("Good Morning!");
};

Key Takeaways

• Scope accessibility define karta hai: Global (kahin bhi), Function/Local (sirf function me), aur Block (sirf `` block me).
• `let` aur `const` **block-scoped** hain, jabki `var` **function-scoped** hai.
• Hoisting declarations ko unke scope ke top par move karta hai.
• `var` variables `undefined` ke saath hoist hote hain, jabki `let` aur `const` initialize hone se pehle access nahi kiye jaa sakte (TDZ).
• Function declarations hoist hoti hain, lekin function expressions nahi.