JavaScript Promise.race() with Example

Can you guess the output? 🤔 (JavaScript — no cheating) Take a second and think… 👇 👇 Output: A D C B Why does this happen? Because of the Event Loop. JavaScript first runs all synchronous code. Once the call stack is empty, the Event Loop: - executes all microtasks (Promises) - then moves to the macrotask queue (timers) That’s why Promise callbacks run before setTimeout, even with 0ms. Once the Event Loop clicks, async JavaScript finally starts making sense. Did you guess it right? 😄 #javascript #js #eventloop #async #frontend

😄 JavaScript be like… “I deleted it, but it’s still there?” Used delete on an array element and expected magic ✨ Instead, JavaScript said: “Here, take an empty slot.” 🕳️ 👉 delete removes the value, not the index 👉 The array length stays the same 👉 Surprise bugs unlocked 😅 💡 Pro tip: If you actually want to remove an element and reindex the array — use splice() 🧹 Small quirks like this are what make JavaScript fun (and sometimes scary 😄). #JavaScript #CodingHumor #WebDevelopment #Frontend #DevLife #LearnJS

🚀 JavaScript Hoisting: What Really Happens Behind the Scenes? Hoisting is one of those JavaScript concepts that looks confusing… until you understand how the JavaScript engine reads your code. 🧠 Hoisting = memory allocation before execution, not moving code upward. 📌 What’s Really Happening? ✔️ var is hoisted and initialized with undefined ✔️ let and const are hoisted but stay in the Temporal Dead Zone (TDZ) ✔️ Accessing let / const before initialization throws ReferenceError ✔️ Function scope creates a new execution context with its own hoisting phase 💡 Rule to Remember: “If JavaScript knows the variable exists but hasn’t initialized it yet → TDZ.” #JavaScript #Hoisting #Frontend #WebDevelopment #JSInternals #InterviewPrep #ReactJS #MERN

JavaScript Arrow Functions This lesson explains how arrow functions provide a more concise and expressive syntax for defining functions in JavaScript. It describes how arrow functions with a single expression implicitly return a value without requiring the return keyword, thereby reducing verbosity. Additionally, the lesson highlights how arrow functions enhance code readability and maintainability while preserving the core behavior and functionality of traditional functions. #script_ish #learntocode #shortsfeed #TechTalk #frontend #webdesign #Shorts #webdevelopment #JavaScript #JS #ArrowFunctions

Event Capturing & Bubbling in JavaScript — something I wish I understood earlier 🧠 If you’ve ever clicked a button and wondered, "Why is the parent handler also firing?" — This is why. When an event happens, it travels through the DOM in phases: • Capturing → top to bottom • Target → the actual element • Bubbling → bottom to top (default) Most bugs around clicks, modals, dropdowns, and menus come from not knowing this flow. Frontend isn’t hard — It’s just easy to misunderstand when fundamentals are skipped ⚡ #JavaScript #Frontend #WebDev

Most developers don’t know this about JavaScript closures 🤯 Closures are not magic. They simply remember the variables even after the function is executed. That’s why: • setTimeout • Event listeners • Callbacks work so smoothly. If closures confuse you → practice small examples, not big codebases. Question: What topic confused you the most in JavaScript? 👇 #JavaScript #WebDevelopment #Frontend #CodingLife

🔧 JavaScript Polyfill – Building Our Own filter() Method Ever thought about how JavaScript’s filter() method works behind the scenes? A Polyfill is a custom implementation of a native method to understand its internal behavior. Let’s create our own version of Array.filter() from scratch! 🧠 What does filter() do? Loops through each element of an array Runs a callback function Returns a new array Only includes elements where callback returns true Original array remains unchanged #JavaScript #Polyfill #Frontend #WebDevelopment #Coding #InterviewPrep

One line of JavaScript that can bite… or save you Ever seen this before? const arr = ["", null, undefined, false, 0, 1, 2]; const cleaned = arr.filter(Boolean); ✅ Output: [1, 2] filter(Boolean) removes all falsy values in JavaScript. ⚠️ That includes: - false - 0 - "" - null - undefined It’s a beautifully clean ES6 trick — but only if you actually want to remove everything falsy. #JavaScript #WebDevelopment #FullStack #Frontend #CleanCode #ES6 #ProgrammingTips

🚀 Master JavaScript in small steps! Today’s focus: the power of the .map() method 🧠 It transforms arrays without mutating them — clean, efficient, and perfect for modern JS workflows. #JavaScript #WebDevelopment #CodingTips #LearnToCode #Frontend

Understanding "this" as a core (Arrow vs Normal Function) Many times confusion around this comes from thinking it depends on where a function is written, but in reality it depends on how the function is called. In the example below, the outer function is called as an object method, so its this refers to the object itself. The inner function is an arrow function, which does not create its own this and instead lexically inherits it from the parent function. This small distinction cleared a lot of confusion for me around this behavior in JavaScript . If the inner function were a normal function instead of an arrow function, the value of this would be different. #JavaScript #LearningInPublic #WebDevelopment #Frontend #NodeJS