JavaScript Type Coercion & Comparison Evaluation

Why JavaScript feels a bit tricky sometimes, The case of "5" - 1 vs. "5" + 1 JavaScript type coercion: console.log("5" - 1); // 4 ✅ Wait... what? console.log("5" + 1); // "51" 🤯 🤔 Why does subtraction work, but addition behaves differently? "-" converts values to numbers → "5" becomes 5 → result is 4 "+" prefers string concatenation → "5" + "1" becomes "51" 🔥 Bonus examples: console.log("5" * 2); // 10 ✅ console.log("5" / 2); // 2.5 ✅ console.log("5" - "2"); // 3 ✅ console.log("5" + "2"); // "52" ❌ 😄 JavaScript sometimes feels like: “Numbers? Strings? Depends on the situation.” these small concepts really show how important fundamentals are. #JavaScript #WebDevelopment #LearningInPublic #Developers #CodingLife #Students

🧠 Day 4 of 21 days challenge JavaScript Hoisting 🤯 // var → undefined // let/const → error Why different behavior? Hoisting is a JavaScript behavior where variable and function declarations are moved to the top of their scope before execution. Only declarations are hoisted, not initializations. For easy understanding :- Hoisting = moving declarations to top var is hoisted with undefined let & const are hoisted but not initialized 👉 That’s why var gives undefined but let/const give error For example :- Normal code : console.log(score); // undefined var score = 90; JS will do this internally: var score; // first reserve console.log(score); // undefined score = 90; // then assign value This changed how I understand variable behavior 🚀 #JavaScript #Hoisting #Frontend

🚀 JavaScript Variables (var, let, const) & Hoisting. Before JavaScript executes your code… Have you ever wondered where variables are stored? 🤔 🧠 What is a Variable? A variable is a named container used to store data. ⚙️ JavaScript gives us 3 ways to declare variables: var a = 10; let b = 20; const c = 30; 🧠 What is Hoisting? 👉 Hoisting is JavaScript’s behavior of moving declarations to the top of their scope before execution. 👉 In simple words: You can access variables and functions even before they are initialized. 📦 Example with var: console.log(x); // undefined var x = 5; 🚫 Example with let: console.log(y); // ❌ ReferenceError let y = 10; 🔒 Same with const: console.log(z); // ❌ ReferenceError const z = 15; 🎯 Key Differences: • var → hoisted + initialized (undefined) • let & const → hoisted but NOT initialized (Temporal Dead Zone) 👉 “In the next post, we’ll dive into Scope — the concept that truly defines how variables behave in JavaScript.” #JavaScript #WebDevelopment #Frontend #Coding

Just built a simple modal popup using HTML, CSS, and JavaScript. Features: • Open and close buttons • Close on Escape key • Click outside to close • Clean UI with background image This helped me understand DOM manipulation, event handling, and class toggling in JavaScript. Still learning and improving step by step. #HTML #CSS #JavaScript #WebDevelopment #LearningByDoing

📊 Day 14 – Poll Answer & Explanation console.log([1,2] + [3,4]); ❓ What will be the output? Many developers expect array concatenation, but JavaScript behaves differently ✅ Step-by-Step Explanation Step 1️⃣ JavaScript sees the `+` operator. The `+` operator can perform: Addition String concatenation Step 2️⃣ When arrays are used with `+`, JavaScript converts them to strings. [1,2].toString() // "1,2" [3,4].toString() // "3,4" Step 3️⃣ Now the operation becomes: "1,2" + "3,4" Step 4️⃣ This performs string concatenation. "1,23,4" ### 🎯 Final Output 1,23,4 📌 Key Concept The `+` operator with arrays converts them into strings first, then performs string concatenation. #JavaScript #WebDevelopment #FrontendDevelopment #Programming #CodingInterview #DeveloperCommunity #100DaysOfCode #LearnToCode

💡 JavaScript Practice — Counting Vowels A small problem, but a good test of logic: 👉 Count the number of vowels in a string Here’s my solution: const str = "javascript"; const vowels = "aeiouAEIOU"; let count = 0; for (let letter of str) { for (let vowel of vowels) { if (letter === vowel) count++; } } console.log(count); 🧠 What this taught me: • How nested loops actually work in real scenarios • Breaking a problem into smaller steps • Writing simple, readable logic ⚡ Next step: I’ll try optimizing this (maybe using includes() or a better approach) If you have a cleaner or more efficient solution, I’d love to see it. #JavaScript #ProblemSolving #WebDevelopment #LearningInPublic

What is Hoisting in JavaScript? Hoisting is JavaScript's default behavior of moving variable and function declarations to the top of their scope before execution. This means you can sometimes use variables or functions before they are declared in the code. 1️⃣ Variable Hoisting with var console.log(a); // undefined var a = 10; Behind the scenes, JavaScript interprets it like this: var a; console.log(a); // undefined a = 10; 👉 The declaration is hoisted, but not the assignment. 2️⃣ Hoisting with let and const console.log(a); // ❌ ReferenceError let a = 10; Variables declared with let and const are hoisted but placed in the Temporal Dead Zone (TDZ), meaning they cannot be accessed before initialization. 3️⃣ Function Hoisting Function declarations are fully hoisted. greet(); function greet() { console.log("Hello JavaScript"); } This works because the entire function definition is hoisted. #javascript #webdevelopment #frontenddeveloper #mernstack #codinginterview #softwareengineering

🔍 A small JavaScript detail that can cause unexpected bugs: Object key ordering Many developers assume object keys are always returned in insertion order, but JavaScript actually follows a specific ordering rule when you iterate over object properties (Object.keys, Object.entries, for...in). The order is: • Integer index keys → sorted in ascending order • String keys → insertion order • Symbol keys → insertion order (not included in Object.keys) This is one of the reasons why using Object as a map can sometimes lead to unexpected iteration behavior when numeric keys are involved. If key order matters, Map is usually the more predictable choice since it preserves insertion order for all key types. Small language details like this are easy to overlook, but they often explain those subtle bugs you run into during debugging. #JavaScript #SoftwareEngineering #Frontend

📚 Today I Learned: Scope Chain in JavaScript The scope chain in JavaScript is used to resolve variable values. When a variable is used, JavaScript looks for it in a specific order. 🔹 How it works: 1️⃣ JavaScript first checks the current scope. 2️⃣ If the variable is not found, it checks the outer (parent) scope. 3️⃣ This process continues until it reaches the global scope. 💻 Example: let a = 10; function outer() { let b = 20; function inner() { let c = 30; console.log(a, b, c); } inner(); } outer(); ✅ The inner() function can access c, b, and a because of the scope chain. #javascript #webdevelopment #frontenddeveloper #learninginpublic

🚀 Day 85 of My #100DaysOfCode Challenge One of the most confusing things in JavaScript is the "this" keyword. Many developers think "this" always refers to the current object… but that’s not always true. In JavaScript, the value of "this" depends on how a function is called, not where it is written. Let’s see a quick example 👇 const user = { name: "Tejal", greet() { console.log(this.name); } }; user.greet(); ✅ Output Tejal Here "this" refers to the object that called the function. But look at this 👇 const user = { name: "Tejal", greet: () => { console.log(this.name); } }; user.greet(); ❌ Output undefined Why? Because arrow functions don’t create their own "this". They inherit "this" from the surrounding scope. ⚡ Simple rule to remember • Regular functions → "this" depends on how the function is called • Arrow functions → "this" comes from the outer scope Understanding this small concept can save hours of debugging in real projects. JavaScript keeps reminding me that small details often make the biggest difference. #Day85 #100DaysOfCode #JavaScript #CodingJourney #WebDevelopment #LearningInPublic