Mastering Asynchronous JavaScript & APIs with Call Stack & Promises

Day 179: Peeling Back the JavaScript Layers 🧅 Today was all about moving beyond "how to code" and diving into how JavaScript actually works under the hood. I spent the day dissecting objects, the prototype chain, and the evolution of asynchronous patterns. 🧬 The Prototype Power I finally stopped looking at __proto__ as a mystery and started seeing it as a roadmap. Understanding how objects inherit properties from their parents—and how we can extend built-in objects with custom methods like getTrueLength()—is a total game-changer for writing dry, efficient code. ⏳ The Async Evolution: Escaping "Hell" We’ve all seen it: the pyramid of doom known as Callback Hell. Today, I practiced refactoring those nested messes into clean Promises and eventually into the sleek, readable Async/Await syntax. It's not just about making the code work; it's about making it readable for the "future me." 👯 Shallow vs. Deep Copy One of the most important lessons today was realizing that the Spread Operator (...) isn't a magic wand for copying. Shallow Copy: Quick and easy, but nested objects are still linked to the original. Deep Copy: Using JSON.parse(JSON.stringify()) to completely sever ties and create a truly independent clone. Key takeaways: Object Mastery: Using Object.values() and hasOwnProperty to navigate data safely. Array Essentials: Re-mastering map, reduce, and Array.from(). The 'New' Keyword: Understanding how it establishes that hidden link to the constructor's prototype. If you’re not understanding the prototype chain, you’re only using 50% of JavaScript’s power! #100DaysOfCode #JavaScript #WebDevelopment #CodingJourney #SoftwareEngineering #AsyncJS #Prototypes #BuildInPublic

🚀 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

Day 4 – Going Deep into JavaScript Foundations Most people rush to frameworks. Today, I went deeper into the core of JavaScript. Not just watching lectures — but actually testing everything in the browser console. 📌 What I practiced today: Linking JS with HTML Script tag placement Understanding defer How browser loads JS Variables (var, let, const) Scope differences Reassignment & redeclaration Why const should be default Expressions vs Statements Why 5 + 10 gives value instantly Why let x = 10; doesn’t Data Types & Special Values Infinity NaN undefined null Symbol typeof behavior Primitive vs Reference (Mind-Blowing Part 🧠) Copy by value Copy by reference Memory visualization with objects Realization today: JavaScript isn’t confusing. We just skip understanding how it actually works. Strong fundamentals = fewer bugs + better logic. This is Day 4 of rebuilding my foundation from scratch. Consistency over hype 🔥 #JavaScript #FrontendDeveloper #BuildInPublic #DeveloperJourney #SheriyansCodingSchool #WebDevelopment

Writing clean JavaScript starts with understanding map(). The map() method helps you transform data without mutating it — clean, readable, and scalable code 💡 Small method. Big impact. #JavaScript #MapMethod #FrontendDeveloper #WebDevelopment #CleanCode #CodingTips

I thought I understood map(), filter(), and reduce() in JavaScript. Individually, they made sense. But then one small doubt confused me: “If I can use filter() to count employees under 30… why can’t I use it to count how many employees belong to each age group?” That question forced me to stop memorizing definitions and actually understand what these methods do. Here’s what finally made it click for me: • map() → transforms each element (same length output) • filter() → selects a subset (smaller array) • reduce() → builds something new (you decide the final shape) The real shift happened when I stopped asking: “Which method should I use?” And started asking: “What does my final result look like?” Array → Array (same length)? → map() Array → Smaller array? → filter() Array → Object / Number / Anything else? → reduce() I’ve written a short article explaining the full journey — including the exact confusion and how I got clarity 👇 🔗 https://lnkd.in/gbJg9aYt #JavaScript #WebDevelopment #FrontendDevelopment #LearningInPublic

TypeScript is a strongly typed superset of JavaScript developed by Microsoft. It adds static typing and advanced features to JavaScript, then compiles down to plain JavaScript that runs anywhere. 🔹 Why Use TypeScript? ✅ 1. Static Typing Catch errors at compile time instead of runtime. let age: number = 25; age = "twenty"; // ❌ Error ✅ 2. Better Code Quality Autocomplete IntelliSense Refactoring support Cleaner large-scale applications ✅ 3. OOP & Modern Features Supports: Interfaces Enums Generics Access modifiers (public/private/protected) Decorators 🔹 Basic Example JavaScript function add(a, b) { return a + b; } TypeScript function add(a: number, b: number): number { return a + b; } 🔹 Key Concepts FeatureDescriptionTypesnumber, string, boolean, any, unknownInterfacesDefine object structureEnumsNamed constant valuesGenericsReusable components with flexible typesType Inference #TypeScript #JavaScript #WebDevelopment #FrontendDevelopment #BackendDevelopment

Today I explored some powerful JavaScript concepts that level up how code actually behaves behind the scenes: ✅ this keyword – Understanding how context works inside objects and functions. ✅ try...catch – Handling errors properly so programs don’t crash unexpectedly. ✅ Arrow Functions (=>) – Writing cleaner and shorter functions (and how this behaves differently inside them). ✅ setTimeout() – Running code after a delay. ✅ setInterval() – Running code repeatedly at fixed intervals. These topics helped me understand how JavaScript handles execution, timing, and errors — which are super important for real-world applications. Slowly building strong fundamentals 💻🔥 #JavaScript #WebDevelopment #LearningInPublic #100DaysOfCode #FrontendDevelopment