CodeJetty’s Post

🚀 Why Does null Show as an Object in JavaScript? 🤯 While practicing JavaScript, I came across something interesting: let myVar = null; console.log(typeof myVar); // Output: object At first, it feels confusing… why is null an object? 🤔 💡 Here’s the simple explanation: null is actually a primitive value that represents "no value" or "empty". But when JavaScript was first created, there was a bug in the typeof operator. Due to this bug, typeof null returns "object" instead of "null". ⚠️ This behavior has been kept for backward compatibility, so changing it now would break existing code. 🔍 Key Takeaways: null → means "nothing" (intentional empty value) typeof null → returns "object" (this is a historical bug) Objects (like {}) also return "object" 💻 Example: let myObj = { name: "John" }; console.log(typeof null); // object ❌ (bug) console.log(typeof myObj); // object ✅ (correct) 📌 Conclusion: Even though both return "object", they are completely different in meaning. 👉 JavaScript is powerful, but it has some quirky behaviors—this is one of them! #JavaScript #WebDevelopment #CodingJourney #100DaysOfCode #FrontendDevelopment

🧠 JavaScript Hoisting Explained Simply Hoisting is one of those JavaScript concepts that can feel confusing — especially when your code behaves unexpectedly. Here’s a simple way to understand it 👇 🔹 What is Hoisting? Hoisting means JavaScript moves declarations to the top of their scope before execution. But there’s a catch 👇 🔹 Example with var console.log(a); var a = 10; Output: undefined Why? Because JavaScript internally treats it like: var a; console.log(a); a = 10; 🔹 What about let and const? console.log(b); let b = 20; This throws a ReferenceError. Because "let" and "const" are hoisted too — but they stay in a “temporal dead zone” until initialized. 🔹 Function hoisting Functions are fully hoisted: sayHello(); function sayHello() { console.log("Hello"); } This works because the function is available before execution. 🔹 Key takeaway • "var" → hoisted with "undefined" • "let/const" → hoisted but not initialized • functions → fully hoisted 💡 One thing I’ve learned: Many “weird” JavaScript bugs come from not understanding hoisting properly. Curious to hear from other developers 👇 Did hoisting ever confuse you when you started learning JavaScript? #javascript #frontenddevelopment #webdevelopment #reactjs #softwareengineering #developers

Day 3: Hoisting — The JavaScript "Magic" That Isn't Magic at All! 🎩✨ Today, I tackled one of the most famous (and often misunderstood) concepts in JavaScript: Hoisting. If you've ever wondered why you can call a function before you even define it in your code, you've witnessed Hoisting in action! 🤔 What is Hoisting? Hoisting is a mechanism where variables and function declarations are moved to the top of their containing scope during the Memory Allocation Phase, before the code even starts executing. 🔍 Under the Hood (The Execution Context) Remember the "Big Box" (Execution Context) from Day 1? Here is what happens during the Memory Phase: Variables (var): JS allocates memory for variables and initializes them with a special value: undefined. Functions: JS stores the entire function body in memory. This is why: Calling a function at Line 1 works perfectly! ✅ Accessing a var at Line 1 returns undefined instead of an error! ⚠️ 💻 The Browser Demo (The Call Stack) Watching this live in the Sources tab of Chrome DevTools was a game-changer. Seeing the Global scope populate with variables before the first line of code executed made everything click. 💡 Interview Tip: When asked "What is Hoisting?", don't just say "it moves code to the top." Better Answer: "Hoisting is the process where the JS Engine allocates memory for variables and functions during the Creation Phase of the Execution Context. This allows us to access functions and variables even before they are initialized in the code, though var will return undefined until the execution reaches its assignment." Next up: Diving into how let and const handle hoisting differently (The Temporal Dead Zone!). Are you a var, let, or const person? Let's discuss below! 👇 #JavaScript #WebDevelopment #Hoisting #NamasteJavaScript #CodingInterviews #FrontendEngineer #ProgrammingLogic #JSFundamentals

💡 var, let, const in JavaScript — easy? Not really 😅 If you think you understand them… try predicting these 👇 for (var i = 0; i < 3; i++) { setTimeout(() => console.log(i), 100); } Output: 3 3 3 for (let i = 0; i < 3; i++) { setTimeout(() => console.log(i), 100); } Output: 0 1 2 🤯 Same code… different output. Why? ⸻ 🔍 The difference: 👉 var is function-scoped • One shared i • All callbacks reference same variable • Final value = 3 👉 let is block-scoped • New i created for each iteration • Each callback gets its own copy 💬 Lesson learned: JavaScript doesn’t just execute code… It follows rules that aren’t always obvious. ⸻ 🚀 Pro Tip: 👉 Prefer let and const over var 👉 Avoid var in modern JavaScript ⸻ #JavaScript #Frontend #WebDevelopment #CodingInterview #JSConcepts #Developers

"Why does JavaScript return "undefined" instead of throwing an error here?" 🤔 If you've ever faced this… you've already encountered Hoisting. Let’s understand it simply 👇 🔹 What is Hoisting? Hoisting means JavaScript moves declarations to the top of their scope before execution. But the behavior is different for "var", "let", and "const" 👇 🔹 var - Gets hoisted - Initialized with "undefined" Example: console.log(a); // 👉 undefined var a = 10; 🔹 let & const - Also hoisted - But NOT initialized This phase is called the Temporal Dead Zone (TDZ) Example: console.log(b); // ❌ ReferenceError let b = 10; 🔹 Function Hoisting Function declarations are fully hoisted ✅ Example: sayHello(); // ✅ works function sayHello() { console.log("Hello"); } 🚀 Pro Tip: Always declare variables before using them. It makes your code predictable and bug-free. 💬 Be honest — did hoisting confuse you at first? 😄 #javascript #webdevelopment #mern #coding #developers

**AVOID JAVASCRIPT'S QUIET BUGS:**   **Don't use ==, use ===** --- 🔺 **THE PROBLEM: == COERCION** ```js console.log([] == false); // prints true! 😅 ``` **The behind-the-scenes journey:** ``` []   ↓ (empty array) ""   ↓ (string) 0   ↓ (number) false   ↓ (boolean) 0 ``` Wait, why is that true?   JavaScript silently converts types, leading to unexpected results. **This is confusing behavior!** --- 🔺 **THE FIX: STRICT EQUALITY** ```js console.log([] === false); // prints false! 🎉 ``` Uses strict comparison without hidden type conversions.   **Predictable and safe.** --- 🔺 **NO HIDDEN CONVERSION!** --- **MAKING YOUR CODE PREDICTABLE: ALWAYS USE ===** Have you encountered confusing JavaScript type coercion? Share your experience! 👇 #javascript #webdevelopment #frontend #coding #developers #mern #learning

🚀 JavaScript Output Prediction Challenge What will be the output? 🤔 💡 Important Behaviour: 👉 JavaScript executes code line by line 👉 The very first line throws the following: ❌ ReferenceError: a is not defined So in reality, the programme stops immediately and nothing else runs. 📌 Now, let’s understand what would happen inside the function (ignoring the first error): 👉 Before execution, JS does Hoisting (memory creation phase) Inside the function: var a → hoisted and initialized as undefined let b → hoisted but kept in Temporal Dead Zone (TDZ) (not accessible yet) 👉 Execution phase: "1:" → undefined (Because 'a' exists but not assigned yet) "2:" → ❌ ReferenceError (because b is in TDZ) After assignment: a = 10 b = 20 "3:" → 10 "4:" → 20 🔥 Core Concepts: JS has 2 phases → Memory Creation + execution. var → hoisted + usable as undefined let/const → hoisted but blocked by TDZ 💬 If you got this right, your JS fundamentals are solid 👇 #JavaScript #Hoisting #Frontend #CodingChallenge #WebDevelopment

🔍 JavaScript Quirk: Hoisting (var vs let vs const) JavaScript be like: 👉 “I know your variables… before you even write them” 😅 Let’s see the magic 👇 console.log(a); var a = 10; 💥 Output: undefined Wait… no error? 🤯 Why? Because `var` is **hoisted** 📌 What is Hoisting? Hoisting is JavaScript’s behavior of **moving variable and function declarations to the top of their scope before execution**. 👉 JS internally does this: var a; console.log(a); // undefined a = 10; So the variable exists… but has no value yet. Now try with `let` 👇 console.log(b); let b = 20; 💥 Output: ReferenceError ❌ Same with `const` 👇 console.log(c); const c = 30; 💥 Error again ❌ Why? Because `let` & `const` are also hoisted… BUT they live in something called: 👉 “Temporal Dead Zone” (TDZ) Translation: 🧠 “You can’t touch it before it’s declared” --- 💡 Simple Breakdown: ✔ `var` → hoisted + initialized as `undefined` ✔ `let` → hoisted but NOT initialized ✔ `const` → same as let (but must assign value) 💀 Real dev pain: Using `var`: 👉 “Why is this undefined?” Using `let`: 👉 “Why is this error?” JavaScript: 👉 “Figure it out yourself” 😎 💡 Takeaway: ✔ Avoid `var` (legacy behavior) ✔ Prefer `let` & `const` ✔ Understand hoisting = fewer bugs 👉 JS is not weird… You just need to know its secrets 😉 🔁 Save this before hoisting confuses you again 💬 Comment “TDZ” if this finally made sense ❤️ Like for more JS quirks #javascript #frontend #codingtips #webdevelopment #js #developer

🧠 JavaScript Myth Busting: "Let and Const are not Hoisted" (Yes, they are!) Have you ever been told in an interview that "let" and "const" aren’t hoisted, but "var" is? It’s one of the most common misconceptions in JavaScript. 👉 Here is the 100% technical truth: All declarations in JavaScript ("var", "let", "const", "function", "class") are hoisted. So, why do they behave differently? It’s all about Initialization and a friendly little neighborhood called the Temporal Dead Zone (TDZ). --- 🚨 The Difference: 1️⃣ "var" is hoisted AND initialized immediately with the value of "undefined". You can access it before its line of code without crashing. 2️⃣ "let" and "const" are hoisted BUT NOT initialized. The JavaScript engine knows they exist, but it reserves the memory without setting any starting value. --- 💀 Enter the Temporal Dead Zone (TDZ): The TDZ is the period of time between the start of a block and the moment the variable is actually initialized (the line where you wrote the declaration in your code). If you try to touch a "let" or "const" variable while it is trapped in the TDZ, JavaScript throws a ReferenceError. --- 💡 Why does this matter? The TDZ exists to enforce better coding practices. It helps prevent bugs by stopping you from using variables that have been created but aren't yet ready for use. --- 📌 Check out the image below for a simple breakdown! 👇 💬 Drop your best analogies in the comments! #javascript #coding #webdevelopment #programmingmyths #softwareengineering #learncoding #frontend

👽 Understanding Higher-Order Functions in JavaScript One of the most powerful features in JavaScript is Higher-Order Functions (HOFs). 💤 A Higher-Order Function is a function that: Takes another function as an argument, OR Returns a function as its result This concept is the backbone of modern JavaScript patterns like functional programming and clean, reusable code. 🔹 Example 1: Function as Argument function greet(name) { return "Hello " + name; } function processUser(callback) { console.log(callback("Amina")); } processUser(greet); 🔹 Example 2: Function Returning Function function multiplier(factor) { return function(number) { return number * factor; }; } const double = multiplier(2); console.log(double(5)); // 10 👁️🗨️ Why Higher-Order Functions matter: Promote code reusability Enable clean and modular design Power built-in methods like map(), filter(), reduce() Make code more declarative and readable Mastering HOFs is a key step toward becoming confident in JavaScript and understanding real-world frameworks. #JavaScript #WebDevelopment #Coding #FunctionalProgramming #FrontendDevelopment