JavaScript Closure Counter Function Challenge

🔷 Senior JavaScript Challenge ⚡ (Event Loop Edition) Predict the output 👇 console.log("A"); setTimeout(() => console.log("B"), 0); Promise.resolve() .then(() => console.log("C")) .then(() => console.log("D")); console.log("E"); 🧠 Question: What is the exact execution order and WHY? (Hint: Microtasks vs Macrotasks) Drop your answer 👇 #JavaScript #EventLoop #AsyncJS #SeniorDevelopers #linkedlin #developer

Day 6 — Find Second Largest Number in an Array (JavaScript) Problem Write a function to find the second largest number in an array. Example Input: [10, 5, 8, 20] Output: 10 Approach First find the largest number, then find the largest number smaller than it. Code function secondLargest(arr){ let largest = -Infinity let second = -Infinity for(let i = 0; i < arr.length; i++){ if(arr[i] > largest){ second = largest largest = arr[i] } else if(arr[i] > second && arr[i] !== largest){ second = arr[i] } } return second } console.log(secondLargest([10,5,8,20])) Alternative Approach function secondLargest(arr){ let sorted = [...new Set(arr)].sort((a,b) => b-a) return sorted[1] } What I Learned How to track two maximum values in a single loop. #javascript #frontenddeveloper #codingpractice #webdevelopment

Most React developers build "Swiss Army Knife" components. And it’s killing their build speed and their sanity. The trap: You build a <Button />. - Then you add a loading prop. - Then an icon prop. - Then variant, size, isFullWidth, and isDisabled. Suddenly, your simple component has 15 props and a massive switch statement inside. The Rule of Three: If a component needs more than 3 conditional styles or complex logic branches, it shouldn't be one component. It should be three. code example - Why this wins - Tree Shaking You only ship the code you actually use. - Readability No more hunting through 200 lines of JSX to find one CSS change. - Testing Testing a specialized component is 10x easier than testing a "God Component." Stop building for every possible future. Build for the current requirement. The best code isn't the most flexible it's the easiest to delete. #reactjs #typescript #cleancode #webdevelopment #javascript

Have you ever had state reset unexpectedly because a component’s position changed?   ➤ React tracks state based on a component’s position in the render tree 🌲📍 ➤ Same component rendered in two different positions → two independent state instances 👯♂️🧪 ➤ If the component stays in the same position (even if props change) → state is preserved 🏠🔄 ➤ If the component unmounts → state is destroyed 💨🗑️ #React #Frontend #JavaScript #WebDevelopment #StateManagement  

🧠 React Doesn’t Update State Immediately (Even Inside the Same Function) Most people know state is async. But here’s the part many don’t realize 👇 Example const [count, setCount] = useState(0); function handleClick() { setCount(count + 1); if (count === 0) { console.log("Still zero?"); } } You click the button. Expected: count = 1 But inside that function… 👉 count is still 0 🔍 Why? Because React doesn’t update state inside the current render cycle. It schedules the update and re-renders later. 🧠 The tricky part Even this won’t work: setCount(count + 1); setCount(count + 1); 👉 Final result = +1, not +2 ✅ Correct way setCount(prev => prev + 1); setCount(prev => prev + 1); Now React uses the latest value. 🎯 The Real Insight State inside a function is a snapshot, not a live value. 💥 Why this matters This causes: Unexpected conditions Wrong calculations Confusing bugs #ReactJS #FrontendDevelopment #JavaScript #ReactHooks #WebDevelopment #CodingTips #LearningInPublic

Most JS developers use closures daily without knowing it. counter() finished running, but increment still remembers count. That's a closure. How does it remember? When a function is created in JavaScript, it doesn't just save the code — it also saves a reference to the variables around it at that moment. So even after the outer function is gone, that reference stays alive in memory as long as the inner function exists. Think of it like this the inner function carries a backpack of its outer variables wherever it goes. 🎒 You already use this in React's useState, debounce, and event handlers. Once I understood this, my React bugs started making sense. 🙂 Did closures confuse you at first? Drop a comment 👇 #JavaScript #MERN #WebDevelopment #LearningInPublic

Another week, another lesson. Just wrapped up a Galaxy Generator for my Three.js sandbox. This build is all about particles and procedural generation. I used sine and cosine to calculate angles and bend straight lines into spiral arms, then applied power functions to naturally scatter the particles from a dense core to dispersed edges. To get the colors right, I used lerp to smoothly blend the hot inside with the cooler outside branches. I also wired up a control panel in the top right. You can mess with the particle count, branch structure, colors, and randomness to generate your own setup. Go tweak the settings and see what you can create here: https://lnkd.in/grJj9Azr #threejs #javascript #webgl #webdevelopment"

Day 1 — Reverse a String (JavaScript) Problem Write a function that reverses a given string. Example Input: "hello" Output: "olleh" Approach Start from the last character of the string and iterate backwards. Keep adding each character to a new string until the loop finishes. Code function reverseString(str){ let reversed = "" for(let i = str.length - 1; i >= 0; i--){ reversed += str[i] } return reversed } console.log(reverseString("hello")) What I Learned Basic string traversal and how iteration works from the end of a string. #javascript #frontenddeveloper #codingpractice #dsa

Have you ever struggled with memory leaks in your JavaScript applications? I've seen it happen to the best of us - a team works on a project, and suddenly the app starts consuming more and more memory, causing it to slow down or even crash. This often happens when we use objects that reference each other, creating a cycle that the garbage collector can't break. A rule of thumb is to use WeakMap and WeakSet to avoid these cycles. However, juniors often overlook the fact that WeakMap keys must be objects, not primitive values. Don't let memory leaks hold you back - use WeakMap and WeakSet to keep your code clean and efficient. Stay ahead of the game and keep learning. #javascript #webdevelopment #weakmap