Most developers use JavaScript every day… but few of us actually know what really happens under the hood when our code runs. As a curiosity, I decided to dive a little deeper into JS and share my learning journey with others like me. 🚀 🤔 Quick question: In JavaScript, what does `this` actually refer to? When I started learning JS, I thought `this` always pointed to the function itself. Turns out… it’s all about **how you call the function** 👇 const car = { brand: "Tesla", start() { console.log(this.brand); } }; car.start(); // "Tesla" const startCar = car.start; startCar(); // undefined 💡 Why the difference? - In `car.start()`, `this` → the `car` object. - In `startCar()`, `this` → global scope (so `brand` is undefined). ### Takeaway The value of `this` in JavaScript depends on the **calling context**, not where the function is written. 👉 What was your biggest “aha moment” with JavaScript? #JavaScript #WebDevelopment #FullStack #LearningInPublic
JavaScript 'this' Keyword Explained with Example
More Relevant Posts
-
JavaScript is not broken; let me explain. Have you ever looked at a snippet of code and felt like the math was gaslighting you? I have been there and still experience it regularly. Walk with me as I breakdown why this piece of code equals 19. Yes I am not kidding, it is 19: We’ll refer to this as "Before and After" Logic: - The Setup: We start with a = 5. Straightforward, right? Hold on... - The Post-increment (a++): When we say b = a++, we instruct JavaScript: "Assign b the current value of a first, then increase a by 1." So, b remains 5, while the value of a is updated to 6. - The Pre-increment (++a): With c = ++a, we state: "Add one to a first, then give that new value of a to c." Since the value of a has become 6 from b = a++, it jumps to 7, and c also becomes 7. By the time the code reaches the console.log method, the values are: a = 7, b = 5, and c = 7. Adding these results gives us 19. JavaScript isn't trying to trick us; it simply follows instructions very literally. Once you understand how it works, these little logic puzzles become second nature. Do you understand? #JS #WebDev #CodingLife #JuniorDev #ProgrammingTips
To view or add a comment, sign in
-
-
Hello Folks! Do you know what is Scope and Scope Chain in JS? Ever wondered how JavaScript knows which variable to use? Especially when the same variable name exists in multiple places? This is not magic. It’s something many beginners use daily but rarely understand early. It’s called Scope — and the secret behind it is the Scope Chain. What is Scope? Scope defines where a variable or function can be accessed in your code. JavaScript mainly works with: • Global Scope • Function Scope • Block Scope (let & const) What is Scope Chain? 1.)When JavaScript tries to access a variable, it: 2.)Looks in the current scope 3.)Moves to the outer scope 4.)Continues up to the global scope This step-by-step lookup is called the Scope Chain. If the variable isn’t found anywhere → ReferenceError. Why This Matters Understanding scope and scope chain helps you: ✔ Avoid unexpected bugs ✔ Write predictable code ✔ Understand closures ✔ Debug faster ✔ Master JavaScript fundamentals Once this concept clicks, JavaScript stops feeling confusing and starts feeling logical. The attached image breaks this down visually. If you’re learning JavaScript — don’t skip this topic. #JavaScript #WebDevelopment #Programming #Developers #LearningToCode #Scope #ScopeChain #Tech 🚀
To view or add a comment, sign in
-
-
🚀 Day 22 of Learning in Public: JavaScript Edition 💻✨ The Secret Sauce of JavaScript — Closures & Scope Chains! After yesterday’s look at the JS Engine, I dove deeper into how JavaScript actually "finds" variables. If you’ve ever wondered how a nested function remembers data from its parent, today’s notes are for you! 🧠 Here’s the breakdown of what I learned: 1️⃣ Lexical Scope & Environment 🌐 Lexical scope is all about hierarchy. A function's "Lexical Environment" consists of: Its own local memory. A reference to the Lexical Environment of its parent. 2️⃣ The Scope Chain ⛓️ When you try to access a variable, JS doesn't just give up if it's not in the local function. It searches: The Local Scope. The Parent's Scope. ...and so on, until it hits the Global Execution Context. This "search path" is what we call the Scope Chain. 3️⃣ Closures: The "Persistent Memory" 💾 A Closure is created when a function is bundled together with its lexical environment. The Power: It allows an inner function to access variables from an outer function even after the outer function has finished executing! 4️⃣ Hoisting Refined: Functions vs. Variables 🚩 I also cleared up some common confusion: Function Declarations: Fully hoisted (you can call them before they are defined!). Function Expressions (Arrow/Anonymous): Treated like variables—if declared with var, they are undefined; if let/const, they are in the Temporal Dead Zone. Slowly but surely, the "inner workings" of JS are becoming second nature. 💻 Question for the community: What was the first real-world use case where you realized you needed a closure? Let’s discuss below! 👇 #JavaScript #LearningInPublic #WebDevelopment #CodingJourney #JSBasics #Closures #ScopeChain #SoftwareEngineering #TechGrowth
To view or add a comment, sign in
-
-
Many people use JavaScript every day. Very few truly understand how JavaScript executes code. In JS Mastery #4, I’ve covered one of the most misunderstood yet core concepts in JavaScript — Hoisting. But this is not just about memorizing rules like “var is hoisted, let and const are not”. 👉 Watch the video here: https://lnkd.in/gkiWnXKE This video goes deeper 👇 🔹 How the JavaScript Engine actually runs your code 🔹 What an Execution Context is (memory phase vs execution phase) 🔹 How the Call Stack manages execution 🔹 Why let and const behave differently 🔹 What Temporal Dead Zone (TDZ) really means 🔹 Why certain errors happen before your code even runs All examples are shown with variables only (var, let, const) so that the fundamentals are crystal clear before moving to functions. If JavaScript has ever felt “weird” or “magical” to you — this video is meant to remove that confusion and replace it with logic and clarity. This is part of my JS Mastery series, where the goal is simple: build strong fundamentals before touching frameworks. Feedback and discussions are always welcome 👇 Let’s learn JavaScript the right way. #JavaScript #JSMastery #WebDevelopment #ProgrammingFundamentals #LearnJavaScript #Hoisting #ExecutionContext #CallStack #TDZ #Hosiyar
To view or add a comment, sign in
-
-
🚀 Full Stack Journey Day 71: Three Ways to Build Arrays in JavaScript! 🏗️📦 Day 71 of my #FullStackDevelopment series! After learning about non-primitive types yesterday, today I’m mastering the different ways to actually initialize an Array in JavaScript. 💻 An array isn't just a list; it’s a powerful object with its own unique construction methods. Here is what I covered: Array Literal [] (The Popular Choice): This is the most common and recommended way. It’s concise, readable, and slightly faster for the browser to process. ⚡ let fruits = ["Apple", "Mango"]; Instance of Array (new Array()): Using the new keyword to create an instance. It achieves the same result as a literal but follows the standard object-oriented approach. 🏛️ let numbers = new Array(1, 2, 3); Array Constructor: This is particularly interesting because it allows you to pre-define the length of an array before you even have the data! If you pass a single number (e.g., new Array(10)), it creates an array with 10 empty slots. 📏 Understanding these differences is key to writing clean, intentional code. While literals are great for everyday use, constructors are powerful tools when you know exactly how much space your data will need in advance. 📂 Access my detailed notes here: 👉 GitHub: https://lnkd.in/gCXTWTzP #JavaScript #WebDevelopment #Frontend #CodingJourney #FullStackDeveloper #SoftwareEngineering #CleanCode #TechLearning #Day71 #ProgrammingLife LinkedIn Samruddhi P.
To view or add a comment, sign in
-
-
🗓️Day 38 of 100 - Why Does JavaScript Feel So Confusing? 🤯 If you’ve ever felt lost while learning JavaScript, trust me — you’re not alone. At first, JavaScript feels unpredictable: "5" + 1 // "51" "5" - 1 // 4 Same values. Different results. No error. 😅 Then there’s this: "5" == 5 // true "5" === 5 // false Small symbols. Big confusion. But here’s the truth 👇 JavaScript isn’t broken. It’s flexible. JavaScript: • Automatically converts types • Allows dynamic values • Follows hidden execution rules • Handles async work behind the scenes Once I stopped asking ❌ “Why is JavaScript so weird?” and started asking ✅ “What rule is JavaScript following?” Things slowly began to make sense. Feeling confused doesn’t mean you’re bad at coding. It means you’re learning a powerful language. One concept at a time. One bug at a time. It gets better. 💪✨ #JavaScript #WebDevelopment #LearningJourney #100DaysOfCode #Programming
To view or add a comment, sign in
-
-
Learning JavaScript often feels slow. You read about closures. You revisit this. You debug the same async bug again. It feels like nothing is moving. Then one day, you read code and understand it. Not because you memorized it — but because your brain finally built the connections. That delay isn’t wasted time. It’s the cost of depth. Most developers quit when things stop feeling fast. The ones who stay… compound. If JavaScript feels slow right now, keep going. 👉 What JavaScript concept took you the longest to understand? #JavaScript #WebDevelopment #SoftwareEngineering #LearningToCode #DeveloperJourney #GrowthMindset #DeepWork #CareerGrowth
To view or add a comment, sign in
-
-
🚀 My Journey to Becoming a Full-Stack DeveloperToday’s study session was all about writing smarter, cleaner, and more powerful JavaScript. Here are a few key concepts I explored: 🔹 Anonymous Functions – Functions without a name, often used for quick operations, callbacks, and cleaner functional patterns. They help reduce unnecessary complexity in code.🔹 Constructor Functions – A classic JavaScript pattern that allows us to create multiple objects with shared structure and behavior. This concept lays the foundation for understanding modern object-oriented programming in JavaScript.🔹 Arrow Functions (ES6) – More concise syntax, lexical this binding, and improved readability. Arrow functions are a game-changer for writing modern, maintainable JavaScript.🔹 Classes – JavaScript’s modern, structured way to implement object-oriented programming. Classes make code easier to organize, reuse, and scale—especially in real-world applications. 💡 One interesting insight: Many modern JavaScript features (like classes and arrow functions) are built on top of older core concepts such as prototypes and constructor functions. Understanding both the modern syntax and the underlying fundamentals is what truly builds strong developers. This is just the beginning of my second certificate Web Development. Step by step, line by line, I’m moving closer to becoming a Full-Stack Developer. #WebDevelopment #JavaScript #FullStackJourney #BYUPathway #CodingDaily #SoftwareEngineering
To view or add a comment, sign in
-
You believe const means no changes but wait JavaScript has a little surprise !! When I started learning JavaScript, I thought const means the value can never change. Then I saw this magic… and got confused. 1. First: const with simple values const a = 10; a = 20; This makes sense. We are trying to change the value, and const does not allow that. 2. Now the surprise: const with objects const user = { name: "John" }; user.name = "Dev"; // allowed This works because: user is pointing to an object in memory & const locks the variable, It does NOT lock what’s inside the object. The variable still points to the same object. We are not changing the variable. We are only changing data inside it. So, const stops reassignment, but allows changes inside objects or arrays. Sharing this as part of my learning journey. Comment below if this is something you didn’t know before! #JavaScript #FrontendDevelopment #WebDevelopment #LearnJavaScript #CodingJourney #ProgrammingTips #CodingForBeginners #JSBasics #FrontendDev #LearnInPublic #CleanCode #CodeBetter #100DaysOfCode #DeveloperLife #TechLearning #JSFundamentals
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