🚨 #TIL: Chrome DevTools Spread Operator FAIL Code that broke: function reverse_word(word) { [...word].forEach(letter => console.log(letter)) } Error: Unexpected token '...' Fix #1 (one-liner): (function(){[...'moon'].forEach(l=>console.log(l))})(); Fix #2: const chars = [...'moon']; chars.forEach(l=>console.log(l)); 💡Pro tip: Array.from('moon') = console-proof #JavaScript #WebDev #ChromeDevTools #EHDTechTips
Chrome DevTools Spread Operator Error Fix
More Relevant Posts
-
⚡ Microtask vs Macrotask Why does Promise.then() run before setTimeout() — even when the delay is 0 ms? Most developers think 0 ms means “immediately”. But JavaScript has a different rule. Here’s what actually happens: 1️⃣ Call Stack executes 2️⃣ All Microtasks run 3️⃣ One Macrotask runs 4️⃣ Repeat And since Promises go to the Microtask Queue, they execute BEFORE Macrotasks like setTimeout(). That’s why: Promise > setTimeout Understanding this small detail can completely change how you debug async code. 💬 Quick Question: What will log first? setTimeout(() => console.log("A"), 0) Promise.resolve().then(() => console.log("B")) Comment your answer 👇 #JavaScript #WebDevelopment #FrontendDeveloper #AsyncProgramming #EventLoop #KeepCoding
To view or add a comment, sign in
-
-
learned about the switch statement in JavaScript. It is used when we need to check multiple conditions. Example: let day = 2; switch(day){ case 1: console.log("Monday"); break; case 2: console.log("Tuesday"); break; default: console.log("Another day"); } Switch statements make code cleaner when handling many conditions. #JavaScript #CodingJourney #FrontendDeveloper
To view or add a comment, sign in
-
-
JavaScript Event Loop — Microtask vs Macrotask setTimeout(() => console.log("Timeout"), 0) Promise.resolve().then(() => console.log("Promise")) Output: Promise Timeout Why? Because: • Promise callbacks go to the Microtask queue • setTimeout goes to the Macrotask queue • Microtasks run before Macrotasks Understanding the event loop helps avoid async confusion and race conditions. If you know this, debugging async becomes much easier. #JavaScript #EventLoop #AsyncProgramming #Frontend
To view or add a comment, sign in
-
📊 Yesterday poll answer and explanation - Day 5 console.log(0 && "Hello"); console.log("Hello" && 0) Rule of && in JavaScript (Important ⭐) 👉 It evaluates left to right 👉 It returns the first falsy value, 👉 If no falsy value is found, it returns the last truthy value These are falsy values in JavaScript false, 0, "", null, undefined, NaN 🎯 Final output 0, 0 Hope this explanation is helpful😊 #JavaScript #FrontendDeveloper #WebDevelopment #LearningJavaScript #InterviewPrep
To view or add a comment, sign in
-
JavaScript Iterator․zip landed in Firefox 148, making it simple to loop over multiple things at the same time. Here's how it works:
To view or add a comment, sign in
-
PhantomRaven campaign hits npm with 88 malicious packages in four waves, using slopsquatting and Remote Dynamic Dependencies to steal dev data like config files and CI/CD tokens. #PhantomRaven #JavaScript #SupplyChain ➡️ https://ift.tt/5ePIGQs
To view or add a comment, sign in
-
-
💡 JavaScript Event Bubbling vs Capturing — a common misconception Ever clicked an element and expected 6 console logs, but only got 3? You’re not crazy — this is a classic DOM events gotcha. 👉 Key insight: Events always go through both capturing and bubbling phases, but listeners only fire in the phase they’re registered for. addEventListener('click', handler, true) That true means: ➡️ “Listen only during the capturing phase” So if you register: 3 capture listeners 0 bubble listeners You’ll see 3 logs, not 6 — even though bubbling did happen. To get all 6 logs, you must explicitly register both: capture listeners (true) bubble listeners (default) 🧠 Mental model that sticks: Capture = top → down Bubble = target → up No listener = no log Understanding this saves hours of debugging... #JavaScript #WebDevelopment #Frontend #DOM #LearningInPublic #SoftwareEngineering
To view or add a comment, sign in
-
🚀 Dive into the world of Arrow Functions! 🏹 Eager to write JavaScript functions more concisely? Arrow Functions to the rescue! These quirky little functions from ES6 pack a punch with their shorter syntax and automatic return feature. No more curly braces cluttering your code—just straight to the point! But here's the catch: they play tag with the 'this' keyword, so be careful where you use them. Think of it like borrowing your neighbor's lawnmower without asking—you might get the job done, but with some quirky side effects! Remember, there's a time and place for everything, including arrow functions. Use them for quick tasks and dodge them where 'this' binding is a big deal. Unleash the power of arrow functions and level up your JavaScript game! 🚀💻 #JavaScript #ProgrammingTips #ArrowFunctions #TechTalks
To view or add a comment, sign in
-
JavaScript is single-threaded, but async code doesn’t just run whenever it feels like it. The engine processes: The call stack Then microtasks (Promises) Then macrotasks (setTimeout, etc.) Which means this: console.log("Start"); setTimeout(() => console.log("Timeout"), 0); Promise.resolve().then(() => console.log("Promise")); console.log("End"); Logs: Start End Promise Timeout Even with 0ms, setTimeout waits until the microtask queue is empty. Once I understood that, async bugs stopped feeling random. The event loop isn’t just trivia, it’s how you reason about timing instead of guessing. #JavaScript #EventLoop #AsyncProgramming #WebDevelopment
To view or add a comment, sign in
-
The "Bug Hunter" (Focus: Stale Closures) Headline: The most common React bug isn't a crash. It's a "Stale Closure." 🕵️♂️ Ever had a useEffect or event listener that keeps seeing an "old" version of your state variable, even though the state definitely updated? Why it happens: JavaScript functions "close over" the variables available when they were defined. If your effect runs once ( [] dependency ), the function inside it is trapped in time. It effectively remembers the state from the first render forever. The Fix: Correct Dependencies: Always include state variables in the dependency array (or trust the linter!). Functional Updates: Use setState(prev => prev + 1) instead of setState(count + 1). If your state isn't updating, check your closures. #Debugging #JavaScript #ReactHooks #SoftwareDevelopment
To view or add a comment, sign in
Explore content categories
- Career
- Productivity
- Finance
- Soft Skills & Emotional Intelligence
- Project Management
- Education
- Technology
- Leadership
- Ecommerce
- User Experience
- Recruitment & HR
- Customer Experience
- Real Estate
- Marketing
- Sales
- Retail & Merchandising
- Science
- Supply Chain Management
- Future Of Work
- Consulting
- Writing
- Economics
- Artificial Intelligence
- Employee Experience
- Workplace Trends
- Fundraising
- Networking
- Corporate Social Responsibility
- Negotiation
- Communication
- Engineering
- Hospitality & Tourism
- Business Strategy
- Change Management
- Organizational Culture
- Design
- Innovation
- Event Planning
- Training & Development