Understanding Single Responsibility Principle in JavaScript

#Day15 Mastering Callbacks in JavaScript Today let’s talk on Callbacks a core concept for handling asynchronous operations in JavaScript. At Mentorship for Acceleration for backend track, I explored how callbacks allow functions to execute after tasks like timers, events, or API responses complete. I also saw firsthand why they can lead to “Callback Hell” if not managed well. Key Concepts Practiced: => Basic callback implementation with setTimeout() => Using callbacks with array methods (.map(), .forEach(), .filter()) => Named vs anonymous callback functions => Understanding the limitations of nested callbacks Callbacks have sharpened my understanding of asynchronous programming and prepared me for cleaner patterns like Promises. Progressing steadily! #M4ACELearningChallenge #LearningInPublic #JavaScript

Understanding JavaScript Execution Context changed how I debug code 👇 At first, JavaScript feels straightforward. But when things don’t behave as expected, execution context is usually where the answer lies. Every time a function runs, JavaScript creates a new execution context. Inside it: • Variables are created • Functions are stored • `this` is determined And all of this happens before the code actually executes. That’s why things like hoisting and scope behave the way they do. This behaves differently than many expect. Once I understood this, debugging became much clearer. Sometimes the problem isn’t the code, it’s understanding how JavaScript runs it. #JavaScript #ExecutionContext #FrontendDevelopment #SoftwareEngineering #Programming #LearningInPublic

🚀 How JavaScript Runs Your Code (Super Simple) Ever wondered what happens behind the scenes when you run JavaScript? 🤔 Let’s break it down step by step 👇 🧠 Step 1: Read 👉 JavaScript reads your code line by line 🔍 Step 2: Break 👉 Code is broken into small pieces (tokens) 🌳 Step 3: Understand (AST) 👉 JavaScript creates a structure (AST) of your code ⚡ Step 4: Convert (JIT) 👉 Code is converted into machine code during execution ▶️ Step 5: Execute 👉 JavaScript runs the compiled code 💡 Easy Flow: 👉 Read → Break → Understand → Convert → Execute 🔥 One line to remember: 👉 “JavaScript understands and runs your code at the same time” 💬 Which step was new for you? 📌 Save this for interviews (very important concept) #javascript #webdevelopment #frontend #coding #programming #javascriptdeveloper #learncoding #developers #100DaysOfCode

Async JavaScript is easier to understand when you stop thinking about “parallel code.” JavaScript still runs on a single main thread. What makes it feel non-blocking is the event loop, callback queue, and browser/runtime APIs working together. That is why setTimeout, fetch, and promises do not pause everything else. The big idea: async code gets scheduled first, then runs when the stack is ready. This infographic breaks that flow into the exact pieces that matter. Which JavaScript topic should I simplify next? #JavaScript #AsyncJavaScript #EventLoop #WebDevelopment #FrontendDevelopment #Programming #Promises #AsyncAwait

Work in progress 💻 Deep in the code today, building out new functionality for Scrimba Advance JavaScript. Sometimes the best commits are the ones that say "promise" twice because that's exactly what clean, asynchronous code delivers. Those small, focused commits? That's where the real progress happens. 𝖶𝖺𝗇𝗍 𝗍𝗈 𝗅𝖾𝖺𝗋𝗇 coding click 𝗁𝖾𝗋𝖾 👉🏽 : https://shorturl.at/cESup #WebDevelopment #JavaScript #Coding

🚀 Day 7 / 30 - JavaScript Coding Practice Today’s challenge: Recreating the Array.map() functionality — without actually using it 👀 Problem: Apply a transformation function to each element of an array and return a new array. 💡 Key Insight: This problem helped me understand what’s happening under the hood of built-in methods like map(). 👉 Instead of relying on .map(), I used a loop to: Iterate through each element Apply the given function with both value & index Build a new transformed array Solution: var map = function (arr, fn) {     let transArr = []     arr.forEach((element, i) => {         transArr.push(fn(element, i) ?? element);     });     return transArr; }; #JavaScript #DSA #CodingPractice #100DaysOfCode #FrontendDevelopment #ProblemSolving

🚀 Unleash the power of asynchronous programming in JavaScript! Learn how to use Promises to handle async operations like a pro. 🌟 For developers, understanding Promises is crucial for writing efficient and responsive code. They help manage asynchronous tasks and avoid callback hell, making your code more readable and maintainable. Now, let's dive into the steps of utilizing Promises: 1. Create a new Promise object using the `new Promise()` constructor. 2. Inside the Promise, define the async task logic using the resolve and reject functions. 3. Use `.then()` to handle the resolved Promise and `.catch()` for any errors encountered. 👨💻 Pro Tip: Chain multiple `.then()` methods for sequential async operations. 🚫 Common Mistake: Forgetting to handle Promise rejections, leading to uncaught errors. What kind of async tasks do you find most challenging to handle with Promises? 🤔💡 🌐 View my full portfolio and more dev resources at tharindunipun.lk #JavaScript #Promises #AsyncProgramming #WebDevelopment #FrontEnd #CodingTips #DeveloperCommunity #LearnToCode

Understanding JavaScript arrays changed how I think as a developer. Coming from a teaching background I thought coding was memorizing syntax. Feeling a level of guilt when I pulled out my cheat sheet. But working with arrays like .map( ) and .reduce( ) helped me make a lasting connection. It’s not about memorizing code. It’s about solving problems efficiently. Instead of looping manually, I can transform and analyze data in a much cleaner way. If you’re learning JavaScript, stick with it until it clicks! Now I focus less on memorizing and more on understanding patterns. #SoftwareDeveloper #Tech #FullStack #JavaScript #SoftwareEngineer #WebDevelopment #MERNStack

𝐃𝐚𝐲 𝟗/𝟏𝟓 𝐨𝐟 𝐦𝐲 𝐉𝐚𝐯𝐚𝐒𝐜𝐫𝐢𝐩𝐭 𝐉𝐨𝐮𝐫𝐧𝐞𝐲 🚀 Day 9… and today felt different. For the first time, I saw JavaScript actually changing something on the screen. That moment felt amazing. 💡 What I learned: DOM (Document Object Model) How JavaScript interacts with HTML getElementById() and querySelector() 🧠 What I understood: JavaScript is not just logic… It can control what users see on a webpage. For example: Click a button → text changes That’s JavaScript in action. At first, I was confused about how JS connects with HTML… But when I tried it myself, it finally clicked. 📌 My biggest takeaway: Seeing your code work on screen hits different. This is where things start to feel real. Still learning… Still exploring… See you on Day 10 🚀 #JavaScript #CodingJourney #LearningInPublic #Day9 #DOM #WebDevelopment #Consistency #Programming

#JourneyToTechJob – Day 16 🚀 #50DaysOfRevision Today I noticed something while solving problems — jumping straight into code creates more confusion. So I focused on: ✔️ Understanding the problem first ✔️ Thinking through the approach ✔️ Then writing a clean solution Taking a few extra minutes to think actually saves more time while coding. #SoftwareDevelopment #JavaScript #DSA #ProblemSolving #BuildInPublic #Consistency #50DaysOfCodeChallenge