Those little question marks in JavaScript? They finally make sense now. 😅 💡 Today I learned something subtle but super useful in JavaScript! Those little question marks ? and ?? actually do a lot more than I thought Here’s what clicked for me today ✅ ?? – Nullish Coalescing Operator Returns the right-hand value only if the left-hand side is null or undefined. So it helps you set true defaults without breaking valid falsy values like 0 or "". let count = 0; console.log(count || 10); // 10 (because 0 is falsy) console.log(count ?? 10); // 0 (because 0 is not null/undefined) ✅ || – Logical OR Operator Returns the right-hand side if the left-hand side is falsy (false, 0, "", null, undefined, NaN). It’s great for simple fallbacks - but not when 0 or an empty string are valid values. ✅ ?. – Optional Chaining Safely accesses nested properties without throwing an error. console.log(user?.profile?.email); ✅ ? : – Ternary Operator A clean one-liner for conditions: let age = 20; let status = age >= 18 ? "Adult" : "Minor"; I love how small syntax choices like "?? " vs || can make code both safer and more expressive. Feels like I leveled up my JavaScript brain today 😄 #JavaScript #TodayILearned #WebDevelopment #CodeTips #Frontend
Understanding JavaScript's question marks: ??, ||, ?, and ?:
More Relevant Posts
-
Understanding this in JavaScript this — one of the most misunderstood keywords in JavaScript. It’s simple in theory… until it suddenly isn’t 😅 Here’s what makes it tricky — this depends entirely on how a function is called, not where it’s written. Its value changes with context. Let’s look at a few examples 👇 const user = { name: "Sakura", greet() { console.log(`Hello, I am ${this.name}`); }, }; user.greet(); // "Sakura" ✅ const callGreet = user.greet; callGreet(); // undefined ❌ (context lost) const boundGreet = user.greet.bind(user); boundGreet(); // "Sakura" ✅ (context fixed) Key takeaways 🧠 ✅ this refers to the object that calls the function. ✅ Lose the calling object → lose the context. ✅ Use .bind(), .call(), or .apply() to control it. ✅ Arrow functions don’t have their own this — they inherit from the parent scope. These small details often trip up developers in interviews and real-world debugging sessions. Once you understand the context flow, this becomes a lot less scary to work with. 💪 🎥 I simplified this in my Day 28/50 JS short video— check it out here 👇 👉 https://lnkd.in/gyUnzuZA #javascript #webdevelopment #frontend #backend #programming #learnjavascript #softwaredevelopment #developerslife #techsharingan #50daysofjavascript
To view or add a comment, sign in
-
💡 Why this JavaScript code works even without let — but you shouldn’t do it! function greet(i) { console.log("hello " + i); } for (i = 0; i < 5; i++) { greet(i); } At first glance, it looks fine — and yes, it actually runs without any error! But here’s what’s really happening 👇 🧠 Explanation: If you don’t declare a variable using let, const, or var, JavaScript (in non-strict mode) automatically creates it as a global variable named i. That’s why your code works — but it’s not a good practice! ✅ Correct and recommended way: for (let i = 0; i < 5; i++) { greet(i); } ⚠️ Why it’s important: -Without let, i leaks into the global scope (can cause bugs later). -In 'use strict' mode, this will throw an error: i is not defined. -let keeps i limited to the loop block — safer and cleaner! 👉 In short: -It works because JavaScript is lenient. -But always use let — it’s safer, cleaner, and professional. 👩💻 Many beginners get confused when this code still works without using let! ........understand these small but important JavaScript concepts 💻✨ #JavaScript #Frontend #WebDevelopment #CodingTips #LearnToCode #Developers
To view or add a comment, sign in
-
*5 Things I Wish I Knew When Starting JavaScript 👨💻* Looking back, JavaScript was both exciting and confusing when I started. Here are 5 things I wish someone had told me earlier: *1. var is dangerous. Use "let" and "const" "var" is function-scoped and can lead to unexpected bugs. "let" and "const" are block-scoped and safer. *2. JavaScript is asynchronous Things like "setTimeout()"and "fetch()" don’t behave in a straight top-down flow. Understanding the *event loop* helps a lot. *3. Functions are first-class citizens* – You can pass functions as arguments, return them, and even store them in variables. It’s powerful once you get used to it. *4. The DOM is slow – avoid unnecessary access* – Repeated DOM queries and manipulations can hurt performance. Use "documentFragment" or batch changes when possible. *5. Don’t ignore array methods* map(), "filter()" , "reduce()", "find()"… they make code cleaner and more readable. I wish I started using them sooner. 💡 *Bonus Tip:* "console.log()" is your best friend during debugging! If you’re starting out with JS, save this. And if you're ahead in the journey — what do *you* wish you knew earlier? #JavaScript #WebDevelopment #CodingJourney #Frontend #LearnToCode #DeveloperTips
To view or add a comment, sign in
-
JavaScript Concept — “The Power of Closures” 💭 Ever wondered how JavaScript functions “remember” the variables around them? That’s the magic of Closures — one of JavaScript’s most elegant features. Closures allow a function to access variables from its outer scope, even after that scope has closed. This concept powers some of the most powerful patterns in JS — from private variables to event handlers. Here’s a small example 👇 function counter() { let count = 0; return function() { count++; return count; }; } const add = counter(); console.log(add()); // 1 console.log(add()); // 2 It’s simple, elegant, and shows how deep JavaScript really is. #JavaScript #WebDevelopment #Coding #Frontend #Learning
To view or add a comment, sign in
-
Are you writing clean, high-performance JavaScript? 🚀 Stop making these common mistakes! This guide is packed with essential JS best practices to instantly level up your code quality and speed: -> Ditch var 🚫: Always use let and const to declare variables to prevent scope and redefinition errors. -> Optimize Loops ⏱️: Boost performance by reducing activity inside loops, like calculating array length once outside the loop. -> Minimize DOM Access 🐌: Accessing the HTML DOM is slow. Grab elements once and store them in a local variable if you need to access them multiple times. -> Use defer ⚡: For external scripts, use the defer attribute in the script tag to ensure the script executes only after the page has finished parsing. -> Meaningful Names ✍️: Use descriptive names like userName instead of cryptic ones like un or usrnm for better long-term readability. -> Be Thoughtful about Declarations 💡: Avoid unnecessary declarations; only declare when strictly needed to promote proper code design. Swipe and save these tips for cleaner, faster JS code! Which practice are you implementing first? 👇 To learn more about JavaScript, follow JavaScript Mastery #JavaScript #JS #WebDevelopment #CodingTips #Performance #CleanCode #DeveloperLife #TechSkills
To view or add a comment, sign in
-
Are you writing clean, high-performance JavaScript? 🚀 Stop making these common mistakes! This guide is packed with essential JS best practices to instantly level up your code quality and speed: -> Ditch var 🚫: Always use let and const to declare variables to prevent scope and redefinition errors. -> Optimize Loops ⏱️: Boost performance by reducing activity inside loops, like calculating array length once outside the loop. -> Minimize DOM Access 🐌: Accessing the HTML DOM is slow. Grab elements once and store them in a local variable if you need to access them multiple times. -> Use defer ⚡: For external scripts, use the defer attribute in the script tag to ensure the script executes only after the page has finished parsing. -> Meaningful Names ✍️: Use descriptive names like userName instead of cryptic ones like un or usrnm for better long-term readability. -> Be Thoughtful about Declarations 💡: Avoid unnecessary declarations; only declare when strictly needed to promote proper code design. Swipe and save these tips for cleaner, faster JS code! Which practice are you implementing first? 👇 To learn more about JavaScript, follow JavaScript Mastery #JavaScript #JS #WebDevelopment #CodingTips #Performance #CleanCode #DeveloperLife #TechSkills
To view or add a comment, sign in
-
🧠 Understanding Lexical Environment in JavaScript Ever wondered how JavaScript knows where to find your variables? 🤔 It’s all because of something called the Lexical Environment. A Lexical Environment is created every time an Execution Context is created — whether it’s the global scope or inside a function. Each Lexical Environment has two parts: 1️⃣ Local Memory – where variables and functions live. 2️⃣ Reference to the Parent Environment – the place where the function was defined (not called). When functions are nested, they form a chain of environments. That chain is called the Scope Chain 🌐 Example 👇 function a() { function c() { console.log("Hello"); } c(); } a(); 🧩 Here’s how the chain looks: c() → inside a() a() → inside Global Environment Global → has no parent (null) ✨ In simple words: Lexical Environment = Local Memory + Reference to Parent Environment The chain of these references = Scope Chain If you understand this concept, you’ve unlocked one of the core building blocks behind scope and closures in JavaScript 🚀 #JavaScript #WebDevelopment #LearningInPublic #MERN #Frontend #CodingJourney
To view or add a comment, sign in
-
-
🚀 My “Aha!” JavaScript Moment: Why does var print 3 three times? A few days ago, I was revisiting some JavaScript fundamentals… and I came across this classic piece of code 👇 for (var i = 0; i < 3; i++) { setTimeout(() => console.log(i), 1000); } I expected: 0 1 2 But guess what I got? 3 3 3 😅 I paused for a second and thought — “Wait… what just happened?” 🧠 The Moment of Clarity Here’s what’s really going on: var in JavaScript is function-scoped, not block-scoped. So inside that for loop, all iterations share one single i variable. By the time the setTimeout callbacks actually run (after 1 second), the loop has already finished — and i has become 3. So all three callbacks look at the same i, and print 3. Boom 💥 — mystery solved. ✅ The Fix? Use let When we switch to let, something magical happens: for (let i = 0; i < 3; i++) { setTimeout(() => console.log(i), 1000); } Now, let is block-scoped, meaning each iteration gets its own copy of i. Each callback “remembers” the value from that iteration. Result: 0 1 2 💡 My Mental Model I now think of it like this: Using var: one whiteboard where you keep erasing and writing new numbers. Everyone who looks later sees the same final number. Using let: each student gets their own notepad — they all remember their own number. 🧩 Key Takeaway Keyword Scope Loop Behavior Output var Function-scoped Shared variable 3, 3, 3 let Block-scoped New variable each iteration 0, 1, 2 We often jump into frameworks, async/await, and APIs… but sometimes it’s these small, fundamental details that sharpen our understanding the most. 🔍 Have you ever had an “aha!” moment like this in JavaScript (or another language)? Share it below — I’d love to hear your story 👇 #JavaScript #WebDevelopment #AsyncJS #Frontend #FullStackDeveloper #LearningToCode #CodingJourney #Developers #CareerGrowth
To view or add a comment, sign in
-
💡 “this” in JavaScript - It’s All About Context 😎 Have you ever written console.log(this) and got something completely unexpected? 😅 You’re not alone every JavaScript developer has been confused by this at least once. But here’s the thing 👇 this isn’t confusing… it’s just based on where you use it. Let’s break it down simply 👇 🌍 In the Global or Function Scope: When you use this outside of any object or function, it refers to the global object in a browser, that’s usually the window object. 🧩 Inside an Object Method: When this is used inside an object’s method, it points to that object itself. It basically says, “I belong to this object.” ⚡ Inside an Arrow Function: Arrow functions don’t have their own this. They automatically take this from the outer (parent) scope where they were defined. That means if an arrow function is inside another function or object, it uses that parent’s this. 🎯 In Event Handlers: When used inside a regular function event handler, this points to the DOM element that triggered the event. Example: button.addEventListener("click", function() { console.log(this); // The button element }); 🧠 So, what’s the main idea? this always depends on how and where it’s used — not just where it’s written. It changes its meaning based on the context it’s in. 💬 Next time JavaScript surprises you with this, remember — it’s not broken… it’s just context-aware. Have you ever been confused by this before? #JavaScript #WebDevelopment #Frontend #CodingTips #LearnInPublic #100DaysOfCode
To view or add a comment, sign in
-
-
💡 Today I explored JavaScript Array Methods While working on my project, I realized how powerful and flexible arrays are in JavaScript. Here are some of the key methods I practiced today 👇 🔹 map() – Transforms each element and returns a new array. 🔹 filter() – Keeps only the elements that pass a given condition. 🔹 reduce() – Combines all elements into a single value (like sum or average). 🔹 forEach() – Loops through each element without returning a new array. 🔹 find() – Returns the first element that matches a condition. 🔹 flat() – Flattens nested arrays into a single array. 🔹 spread (...) – Expands elements of an array (helpful for copying or merging). 🔹 concat() – Joins multiple arrays together. 🔹 slice() / splice() – Extracts or modifies parts of an array. 🔹 some() / every() – Checks if some or all elements match a condition. Each method plays an important role in writing cleaner and more efficient code ✨ 👉 #JavaScript #WebDevelopment #Frontend #CodingJourney #LearnInPublic #ReactJs #Programming
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
Thanks Sharing basic but essentials key points in JavaScript!!