JavaScript Function Parameters Linked to Arguments in Non-Strict Mode

Why JavaScript doesn't crash when you call a function before defining it. 🧠 I recently dove deep into the "Execution Context" of JavaScript, and the concept of Hoisting finally clicked. If you’ve ever wondered why this code works: greet(); function greet() { console.log("Hello LinkedIn!"); } ...the answer lies in how the JS Engine treats your code before it even runs a single line. The Two-Phase Secret: Memory Creation Phase: Before the "Thread of Execution" starts, JavaScript scans your code and allocates memory for variables and functions. Functions are stored in their entirety in the Variable Environment. Variables (var) are stored as undefined. Code Execution Phase: Now, the engine runs the code line-by-line. Because the function is already sitting in the memory component, calling it on line 1 is no problem! The Key Takeaway: Hoisting isn't "moving code to the top" (that’s a common myth). It’s actually the result of the Memory Creation Phase setting aside space for your declarations before execution starts. Understanding the "how" behind the "what" makes debugging so much easier. #JavaScript #WebDevelopment #CodingTips #Hoisting #ProgrammingConcepts

✅ Understanding undefined vs null Clearly This morning’s code was: let x; console.log(x); console.log(typeof x); x = null; console.log(x); console.log(typeof x); 💡 Correct Output undefined undefined null object Yes , the last line surprises many 😄 Let’s understand why. 🧠 Simple Explanation : 🔹 Line 1: console.log(x); let x; x is declared But no value is assigned So JavaScript automatically gives it: undefined ✔ Output: undefined 🔹 Line 2: console.log(typeof x); The type of undefined is: "undefined" ✔ Output: undefined 🔹 Line 3: x = null; Here, we explicitly assign null. Important rule 👇 👉 null means intentional absence of value So: console.log(x); ✔ Output: null 🔹 Line 4: console.log(typeof x); This is the classic JavaScript quirk 👀 Even though x is null: typeof null returns: "object" ✔ Output: object 📌 This is a known bug in JavaScript kept for backward compatibility. 🎯 Key Takeaways : undefined → variable declared, value not assigned null → value explicitly set to “nothing” typeof undefined → "undefined" typeof null → "object" ❌ (historical JS bug) 📌 That’s why many developers check null like this: x === null 💬 Your Turn Did you already know typeof null is "object"? 😄 Comment “Knew it 👍” or “Learned today 😮” #JavaScript #LearnJS #FrontendDevelopment #CodingInterview #Basics #TechWithVeera #WebDevelopment

Ever encountered a JavaScript bug where your array mysteriously loses elements? 😳 Picture this: you're using `splice` to remove an item, but your entire array gets scrambled in production. I faced this when a `for...in` loop, meant for objects, was mistakenly used for arrays. Here's a simple example: ```javascript const arr = [1, 2, 3, 4]; for (let i in arr) { arr.splice(i, 1); } ``` In theory, you'd expect the loop to remove elements one by one. But the index shifts during each `splice`, causing skipped elements and unexpected outcomes. This little oversight can wreak havoc, especially if your array processing is complex. Why's it hard to spot? It's subtle. Your tests might pass with small data, but crash and burn with real-world inputs. Fix it by switching to a `for...of` loop or using array methods like `filter`. It ensures you process elements without altering the loop index mid-execution. This simple change made our code robust! Have you stumbled upon similar JavaScript quirks? Share your experiences! 👇 #JavaScript #Debugging #CodingProblems #JavaScript #Debugging #CodingProblems

🌙 Evening Post — Function Reference vs Function Call (Very Important!) This morning’s code was: function show() { return "Hello"; } console.log(show); console.log(show()); 💡 Correct Output : [ Function : show ] Hello (Exact formatting may vary by browser, but the meaning is the same.) 🧠 Simple Explanation : 🔹 Line 1: console.log(show); Here, we are NOT calling the function. show refers to the function itself JavaScript prints the function definition This is called a function reference So the output shows something like: [ Function : show ] 👉 You’re telling JS: “Show me the function, not run it.” 🔹 Line 2: console.log(show()); Now the function IS called. show(); // returns "Hello" So this becomes: console.log("Hello"); ✔ Output: Hello 🎯 Key Takeaways : show → function reference (no execution) show() → function execution Functions in JS are values, just like numbers or strings You can pass functions around without calling them 📌 This difference is very important in: callbacks event handlers React props higher-order functions 💬 Your Turn Did you already know this difference? 😄 Comment “Clear now ✅” or “Didn’t notice this before 🤯” #JavaScript #LearnJS #FrontendDevelopment #CodingInterview #Functions #TechWithVeera #WebDevelopment

The Truth Behind JavaScript’s Oldest “Bug” 🐞 Ever felt like JavaScript was gaslighting you? 😅 typeof null === "object" has confused developers for decades. It’s often called a 30-year-old bug—but technically, it’s a legacy behavior preserved for backward compatibility. What actually happened? In the first implementation of JavaScript, values were represented as a combination of two parts,  a type tag(The first 3 bits) and an actual value(with the remaining bits). The type tag for objects was 0. And null was represented as the NULL pointer which is nothing but all zeros. The JS engine saw those 3 first zeros of null and misclassified it as an object! It was a simple storage mistake. Once the web depended on it, fixing it would’ve broken the internet. So the JS team made a deliberate choice: don’t fix it. 📚 References: • MDN Web Docs: https://lnkd.in/gqAB6zJ5 • TC39 discussions: https://lnkd.in/gU3aRR3r • 2ality deep dive: https://lnkd.in/gX_qDZyz 🛡️ Safe pattern: if (data !== null && typeof data === "object") { ... } JavaScript didn’t lie to you—it just has a very long memory 😄 #JavaScript #WebDevelopment #SoftwareEngineering #ProgrammingHumor

🚀 JavaScript Tip: var vs let vs const — Explained Simply Understanding how variables work in JavaScript can save you from hard-to-debug issues later. Think of variables as containers that hold values ☕ 🔹 var – Old Style (Not Recommended) ➡️ Function scoped ➡️ Can be re-declared & reassigned ➡️ Gets hoisted → may cause unexpected bugs 👉 Use only if maintaining legacy code 🔹 let – Modern & Safe ➡️ Block scoped {} ➡️ Cannot be re-declared ➡️ Can be reassigned ➡️ Hoisted but protected by Temporal Dead Zone 👉 Best for values that change over time 🔹 const – Locked & Reliable ➡️ Block scoped {} ➡️ Cannot be re-declared or reassigned ➡️ Must be initialized immediately 👉 Best for fixed values and cleaner code ✅ Best Practice Use const by default, switch to let only when reassignment is needed, and avoid var 🚫 💡 Small fundamentals like these make a big difference in writing clean, scalable JavaScript. #JavaScript #WebDevelopment #FrontendDevelopment #ProgrammingTips #LearnJavaScript #CodingBestPractices #DeveloperLearning #SoftwareEngineering #100DaysOfCode

𝐓𝐨𝐝𝐚𝐲 𝐈 𝐫𝐞𝐯𝐢𝐬𝐢𝐭𝐞𝐝 𝐚 𝐜𝐨𝐫𝐞 𝐉𝐚𝐯𝐚𝐒𝐜𝐫𝐢𝐩𝐭 𝐜𝐨𝐧𝐜𝐞𝐩𝐭 𝐭𝐡𝐚𝐭 𝐪𝐮𝐢𝐞𝐭𝐥𝐲 𝐚𝐟𝐟𝐞𝐜𝐭𝐬 𝐜𝐨𝐝𝐞 𝐪𝐮𝐚𝐥𝐢𝐭𝐲: 𝒗𝒂𝒓 𝒗𝒔 𝒍𝒆𝒕 𝒗𝒔 𝒄𝒐𝒏𝒔𝒕 👇 var x = 10; // function-scoped let y = 20; // block-scoped const z = 30; // block-scoped & cannot be reassigned Key differences that matter in real projects: > "var" is function-scoped and can lead to unexpected bugs due to hoisting. > "let" provides block scope, making control flow safer. > "const" enforces immutability of the reference, improving readability. Modern JavaScript favors const by default, uses let when reassignment is required and avoids var in most cases. Back to fundamentals — with a modern JS lens. Any insights or suggestions are welcome🙂 #DAY6 #JavaScript #WebDevelopment #FrontendDevelopment #LearningInPublic #dailyChallenge

Most developers reach for IDs, classes, or extra state before remembering this: JavaScript already gives you a clean way to attach structured metadata directly to DOM elements. If you have ever used data-* attributes in HTML, you can access them in JavaScript through the dataset property. No parsing. No brittle string manipulation. No unnecessary DOM lookups. It is simple, readable, and surprisingly underused. This pattern is especially useful for event delegation, lightweight UI state, dynamic lists, and keeping behaviour close to the element it belongs to. Small details like this make frontend systems cleaner and easier to reason about without introducing extra abstractions. Not everything needs global state. Sometimes the platform already solved the problem. In the example attached, notice how `data-user-id` becomes `dataset.userId`. Hyphenated attributes automatically convert to camelCase. It is a small feature, but small features compound into cleaner, more maintainable frontend code. What is one underrated JavaScript feature you think more developers should use? Github Gist: https://lnkd.in/d6pjMP7J #webdevelopment #javascript #cleancode

Ever Wonder How JavaScript Runs in Your Browser? 🚀 Let’s peek under the hood: 1️⃣ JS Arrives in the Browser Your browser downloads HTML, CSS, and JavaScript from the server. JS is just text, but it needs to be understood by the browser to run. 2️⃣ Parsing & Compiling The JavaScript engine (like V8 in Chrome) reads your JS line by line and converts it into machine code your computer can execute. 3️⃣ The Call Stack JS is single-threaded, meaning it runs one task at a time. Functions are added to the call stack when called and removed when finished. 4️⃣ Event Loop & Async Magic JS handles asynchronous tasks (like setTimeout or API calls) with the event loop. Tasks wait in the task queue and are executed when the call stack is empty. 5️⃣ Interaction with the DOM JS manipulates the DOM to update the page dynamically. Changing elements triggers reflows and repaints, so what you see on screen updates instantly. 💡 In a Nutshell: Load JS Parse & Compile Run in Call Stack Handle Async Tasks Update the DOM Understanding this makes debugging and writing efficient JS much easier. #JavaScript #WebDevelopment #Coding #Programming #FrontendDevelopment #WebDevTips #TechInsights #SoftwareEngineering #DeveloperLife #LearnToCode #CodeNewbie #JavaScriptTips #Browser #WebPerformance #AsyncJS

🧩 JavaScript Output-Based Question (Hoisting) ❓ What will be printed? 👉 Comment your answer below (Don’t run the code ❌) Correct Output : undefined 🧠 Why this output comes? (Step-by-Step) 1️⃣ Function creates its own scope The IIFE (Immediately Invoked Function Expression) creates a new local scope. 2️⃣ var a is hoisted inside the function Inside the function, this line: var a = 20; is treated by JavaScript as: var a; // hoisted a = 20; // assigned later So when console.log(a) runs: • the local a exists • but it is not initialized yet That’s why: undefined is printed instead of 10. 3️⃣ Local a shadows the global a The global a = 10 is completely ignored inside the function because the local var a shadows it. 🔑 Key Takeaways ✔️ var declarations are hoisted ✔️ Initialization happens later ✔️ Local variables shadow global ones ✔️ Hoisting bugs often appear inside functions Hoisting doesn’t move code — it moves declarations. #JavaScript #Hoisting #InterviewQuestions #FrontendDeveloper #MERNStack #WebDevelopment