The "this" Keyword: Predictable or a Trap? 🧐 Most devs think they understand this, until it returns undefined. Can you guess the output of this simple object? const obj = { a: 10, f: function () { return this.a; }, }; console.log(obj.f()); The answer seems easy... but do you know what happens to this if we change that function to an Arrow Function? 🤯 In my latest video, I break down exactly how execution context works so you never have to guess again. #JavaScript #WebDev #CodingTips #SoftwareEngineering #Programming
More Relevant Posts
-
Closures look confusing at first, but the core idea is simple: A closure is when a function remembers variables from the scope where it was created, even after that outer function has finished running. That is why closures are so useful for private state, counters, factories, and callbacks. The infographic breaks it down visually: create a variable, return an inner function, and that inner function keeps access to the remembered value. If you understand this, a lot of JavaScript starts making more sense. What JavaScript concept should I simplify next? #JavaScript #Closures #WebDevelopment #FrontendDevelopment #Programming #LearnToCode #ReactJS #SoftwareEngineering
To view or add a comment, sign in
-
-
Demystifying the JavaScript Event Loop: Call Stack, Task Queue, and Asynchronous Execution Learn how JavaScript’s single‑threaded engine handles asynchronous code using the call stack and task queues. This tutorial breaks down the event loop, visualizes execution order, and shows best‑practice patterns for reliable, non‑blocking code. Read the full article 👇 https://lnkd.in/g-8QSE-c #JavaScript #WebDevelopment #Programming #Tech #SoftwareEngineering #EventLoop #AsyncProgramming #CallStack #TaskQueue #NonBlockingCode #FutureOfWork #DigitalTransformation
To view or add a comment, sign in
-
-
this in JavaScript looks simple… until it starts pointing to the wrong thing 😵 Same function, different outputs — just because of how it’s called. So what does this actually mean? 👉 It’s not about where the function is written 👉 It’s about who is calling the function In this blog, I’ve explained: What this really represents this in global context this inside objects and functions How calling context changes everything Kept it simple with clear examples (no unnecessary theory) ✨ 🔗 Read here: https://lnkd.in/dMkPffeA Would appreciate your feedback 🙌 #javascript #webdevelopment #programming #coding
To view or add a comment, sign in
-
-
The new keyword looks simple… but most people use it without knowing what it actually does 👀 That’s exactly where confusion starts. Why does a function suddenly create objects? Where does this point? And how do methods magically appear? 👉 It’s all because of new. In this blog, I’ve explained: What new actually does behind the scenes How constructor functions create objects How objects link to shared methods (prototype) Why everything breaks without new Kept it simple, with step-by-step explanation and examples ✨ 🔗 Read here: https://lnkd.in/dyZwek-x Would love your feedback 🙌 Next: Constructor Functions or this keyword? #javascript #webdevelopment #programming #coding
To view or add a comment, sign in
-
-
I had a habit of attaching click handlers to every single item in a list… It worked, so I never questioned it. But as the list grew, something felt off… more code, more listeners, and probably more memory being used 🤔 That’s when I came across event delegation. Instead of adding multiple listeners, you just attach one listener to the parent and let events bubble up. Same result… but way cleaner. Less memory usage. Better performance. Now whenever I see multiple listeners on similar elements, it just feels… unnecessary 😅 Sometimes the smarter solution isn’t adding more… it’s doing less in the right place. #JavaScript #WebDevelopment #Frontend #Coding #Performance #DevTips #Programming #CleanCode #LearnToCode
To view or add a comment, sign in
-
-
Event Bubbling vs Event Capturing: Mastering DOM Event Propagation Learn the difference between event bubbling and event capturing, when to use each, and how to implement them with clean, production‑ready JavaScript code. This tutorial walks you through concepts, practical examples, and best‑practice patterns. Read the full article 👇 https://lnkd.in/gYXpk-ST #JavaScript #WebDevelopment #Programming #Coding #Tech #EventPropagation #DOMEvents #EventBubbling #EventCapturing #FrontendEngineering #DigitalTransformation #FutureOfWork
To view or add a comment, sign in
-
-
Most people think the Event Loop just "manages async code." It actually plays favourites. I assumed every callback waited in the same line. Turns out, there are two queues — and they don't get equal treatment. The moment the call stack goes empty, the Event Loop doesn't just grab the next available function. It checks the Microtask Queue first — always. 𝐏𝐫𝐨𝐦𝐢𝐬𝐞𝐬 𝐚𝐧𝐝 𝐟𝐞𝐭𝐜𝐡() 𝐜𝐚𝐥𝐥𝐛𝐚𝐜𝐤𝐬 𝐥𝐢𝐯𝐞 𝐡𝐞𝐫𝐞. 𝐓𝐡𝐞𝐲 𝐜𝐮𝐭 𝐭𝐡𝐞 𝐥𝐢𝐧𝐞, 𝐞𝐯𝐞𝐫𝐲 𝐬𝐢𝐧𝐠𝐥𝐞 𝐭𝐢𝐦𝐞. Regular callbacks — button clicks, setTimeout — wait in the Callback Queue. They only get their turn once the Microtask Queue is fully drained. So the hierarchy is clear: → Call Stack executes → Microtask Queue gets priority when stack empties → Callback Queue runs only after microtasks are done One event loop. Two queues. One clear winner. Next time your async code behaves unexpectedly — check which queue it's sitting in. 🔍 → Agree or disagree? Tell me below. #BuildingInPublic #JavaScript #SoftwareEngineering #DeveloperJourney #LearningInPublic #Programming #TechCommunity #WebDevelopment
To view or add a comment, sign in
-
-
📚 New article just published on SYUTHD! 🔖 Mastering Local-First Frameworks: The 2026 Guide to Building With PGLite and CRDTs 🏷️ Category: JavaScript Frameworks 📖 Full article → https://lnkd.in/gMuajsA2 👉 Follow our page for more tech tutorials: https://lnkd.in/gsJDptPM 💬 Telegram: https://t.me/nisethtechno 👍 Facebook: https://lnkd.in/gsKv3Dyn #JavaScriptFrameworks #Tech #Tutorial #Programming #TechBlog #2026
To view or add a comment, sign in
-
Ever wondered why JavaScript shows “undefined” even before a variable is assigned? 🤯 console.log(a); var a = 10; At first glance, this feels confusing… But the answer lies in one powerful concept: 👉 Execution Context Here’s what actually happens behind the scenes: ⚡ When JavaScript runs your code, it creates an Execution Context ⚡ In the memory phase, variables are hoisted → initialized as undefined ⚡ In the execution phase, code runs line by line and values get assigned I made a short video explaining the basics—would love your feedback 🙌 #javascript #webdevelopment #frontend #programming #coding #developers #learntocode #100daysofcode
To view or add a comment, sign in
-
Mastering Memory Management in JavaScript: A Practical Guide JavaScript abstracts away low‑level memory handling, but developers still need to understand how the engine allocates, retains, and releases memory to write performant, leak‑free applications. This guide covers the memory model, common leak patterns, detection techniques, and best‑practice solutions with real‑world code examples. Read the full article 👇 https://lnkd.in/gvd2MRAK #Technology #Programming #WebDevelopment #SoftwareEngineering #Coding #JavaScriptMemory #MemoryManagement #JSPerformance #MemoryLeaks #FrontendOptimization #FutureOfWork #DigitalTransformation
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