JavaScript Kaise Kaam Karti Hai? (Compilation & Execution)
Samjhein ki parde ke peeche aapka JavaScript code browser me kaise execute hota hai.
1. JavaScript Engine Kya Hota Hai?
JavaScript ko execute karne ke liye har modern browser me ek special program hota hai jise JavaScript Engine kehte hain. Yeh engine JavaScript code ko read, interpret, aur execute karta hai.
Kuch popular JavaScript Engines hain:
- V8 Engine: Google Chrome aur Node.js me use hota hai.
- SpiderMonkey: Mozilla Firefox me use hota hai.
- Chakra: Microsoft Edge me use hota tha (ab Edge bhi V8 use karta hai).
- JavaScriptCore: Safari me use hota hai.
Har engine JavaScript code ko fast execute karne ke liye optimized hota hai, aur iske andar Just-In-Time (JIT) Compilation ka use hota hai.
2. JavaScript Execution Ka Process
Jab browser JavaScript code ko execute karta hai, toh yeh ek 3-step process hota hai:
Step 1: Code Parsing (Tokenization)
Sabse pehle, JavaScript Engine code ko line by line padhta hai aur use chhote-chhote tukdo me todta hai, jinhe tokens kehte hain. Phir in tokens se ek structured representation banata hai jise Abstract Syntax Tree (AST) kehte hain.
let x = 10;
Yeh code parse hone ke baad `let`, `x`, `=`, `10`, `;` jaise tokens me badal jaata hai.
Step 2: Compilation & Optimization (JIT)
Modern JavaScript engines Just-In-Time (JIT) Compilation ka use karte hain. Yeh traditional compilers se alag hai. JIT compilation code ko execute karte waqt hi machine code me convert karta hai aur use optimize karta hai, jisse performance bohot fast ho jaati hai.
Step 3: Code Execution
Compiled code ko execute karne ke liye do main components hote hain:
- Memory Heap: Yahan par sabhi variables aur objects store hote hain. Jab aap `let name = "Amit";` likhte hain, toh "Amit" value memory heap me store hoti hai.
- Call Stack: Yeh ek single-threaded system hai jo function calls ko track karta hai. Jab koi function call hota hai, woh stack ke upar add hota hai, aur jab complete ho jaata hai, toh wahan se remove ho jaata hai.
function greet() {
console.log("Hello");
}
greet();
Is code me, `greet()` function call stack me add hoga, `console.log()` execute hoga, aur fir `greet()` function stack se pop ho jayega.
3. Synchronous vs. Asynchronous Execution
Synchronous (Blocking)
By default, JavaScript synchronous hai, yaani code line-by-line execute hota hai. Ek line ka execution complete hone ke baad hi agli line execute hoti hai.
console.log("First");
console.log("Second");
Output hamesha "First" aur fir "Second" hoga.
Asynchronous (Non-Blocking)
Lekin kuch tasks (jaise server se data fetch karna ya timer set karna) time lete hain. Agar yeh synchronous hote, toh poora page freeze ho jaata. Isliye, JavaScript asynchronous operations ko Event Loop, Callback Queue, aur Web APIs (jo browser provide karta hai) ki madad se handle karta hai.
console.log("Start");
setTimeout(() => {
console.log("Delayed Message after 2 seconds");
}, 2000);
console.log("End");
// Output:
// Start
// End
// Delayed Message after 2 seconds
Yahan, `setTimeout` Web API ko bhej diya jaata hai, aur baaki ka code execute hota rehta hai. Jab 2 seconds poore ho jaate hain, toh callback function queue me jaata hai aur call stack ke khali hone par execute hota hai.
Key Takeaways
- Har browser me ek JavaScript Engine hota hai jo code execute karta hai (e.g., V8 in Chrome).
- Modern engines JIT (Just-In-Time) Compilation ka use karte hain for better performance.
- Memory Heap me variables store hote hain aur Call Stack me functions execute hote hain.
- JavaScript by default synchronous hai, lekin asynchronous tasks ko Event Loop aur Web APIs ki madad se handle karta hai.
Synchronous aur asynchronous code ke order of execution ko `console.log` ka use karke dekhein.
Practice in JS EditorApni knowledge test karne ke liye is quick quiz ko dein.
Start Quiz