#151 var vs let in JavaScript?

Difference between var and let in JavaScript:

1. Scope

   • var → Function-scoped (accessible throughout the function).
   • let → Block-scoped (accessible only inside { }).

   ✅ Example:

   if (true) {
     var x = 10;
     let y = 20;
   }
   console.log(x); // ✅ 10
   console.log(y); // ❌ ReferenceError
   

---

1. Hoisting

   • var is hoisted and initialized with undefined.
   • let is hoisted but not initialized (in temporal dead zone until declared).

   ✅ Example:

   console.log(a); // ✅ undefined
   var a = 5;
   
   console.log(b); // ❌ ReferenceError
   let b = 10;
   

---

1. Redeclaration

   • var → Can be redeclared in the same scope.
   • let → Cannot be redeclared in the same scope.

   ✅ Example:

   var name = "Dev";
   var name = "John"; // ✅ Allowed
   
   let age = 25;
   let age = 30; // ❌ Error: Identifier 'age' has already been declared
   

---

1. Global Object Property (window in browsers)

   • var → Attaches to window object when declared globally.
   • let → Does not attach to window.

   ✅ Example (in browser console):

   var city = "Delhi";
   let country = "India";
   
   console.log(window.city);    // ✅ "Delhi"
   console.log(window.country); // ❌ undefined
   

---

1. Best Practice
   • Use let (or const) instead of var → safer, block-scoped, avoids accidental bugs.

---

🔹 Quick Comparison Table

Feature	var 🟢	let 🔵
Scope	Function-scoped	Block-scoped
Hoisting	Hoisted, initialized with undefined	Hoisted, TDZ until declaration
Redeclaration	Allowed	❌ Not allowed
Reassignment	Allowed	Allowed
Global Object (window)	✅ Adds to window	❌ Doesn’t add
Best Use Case	Legacy code	Modern JS (ES6+)

---

✅ Short Interview Answer

“var is function-scoped, hoisted with undefined, and can be redeclared. let is block-scoped, hoisted but in the temporal dead zone, and cannot be redeclared. Best practice is to use let or const in modern JavaScript to avoid bugs.”