Understanding Set in JavaScript Recently, I revisited Set in JavaScript, and it’s one of those small features that can greatly improve performance and code clarity. - What is a Set? A Set is a special JavaScript object that stores unique values only — duplicates are automatically removed. const mySet = new Set(); mySet.add(1); mySet.add(2); mySet.add(2); // duplicate ignored mySet.add(3); console.log(mySet); // Set(3) {1, 2, 3} - Ways to create a Set From scratch → new Set() From an array → perfect for removing duplicates const arr = [1, 2, 2, 3, 4, 4]; const uniqueValues = new Set(arr); - Useful Set Methods add() → Add value has() → Check if value exists (returns true/false) delete() → Remove value clear() → Remove all values size → Get total count const fruits = new Set(["apple", "banana", "mango"]); fruits.has("banana"); // true fruits.delete("banana"); console.log(fruits.size); // 2 - Why use Set? Stores unique values Easily removes duplicates Faster lookup performance Cleaner logic compared to arrays - Performance matters: Set.has() → O(1) Array.includes() → O(n) Small concepts like this can make a big difference when handling large datasets in real-world applications. - To know more, please visit w3schools.com and MDN 😊 #JavaScript #WebDevelopment #FrontendDevelopment #NodeJS #ReactJS #Programming #SoftwareDevelopment #LearningInPublic
Mastering JavaScript Sets for Efficient Code
More Relevant Posts
-
🔁 Understanding Loops in JavaScript — A Quick Guide Loops are fundamental in JavaScript when you need to execute a block of code multiple times. Choosing the right loop can make your code more readable and efficient. Here are the most common types of loops in JavaScript 👇 1️⃣ "for" Loop – Best when you know how many times the loop should run. for (let i = 0; i < 5; i++) { console.log("Iteration:", i); } 2️⃣ "while" Loop – Runs as long as the condition remains true. let i = 0; while (i < 5) { console.log("Count:", i); i++; } 3️⃣ "do...while" Loop – Executes at least once before checking the condition. let i = 0; do { console.log("Value:", i); i++; } while (i < 5); 4️⃣ "for...of" Loop – Perfect for iterating over iterable objects like arrays, strings, or maps. const fruits = ["Apple", "Banana", "Mango"]; for (const fruit of fruits) { console.log(fruit); } 5️⃣ "for...in" Loop – Used to iterate over object keys. const user = { name: "Sujit", role: "Frontend Developer" }; for (let key in user) { console.log(key, user[key]); } 💡 Quick Tip: Use "for...of" for arrays and "for...in" for objects to keep your code clean and readable. Mastering loops helps you handle data structures, API responses, and complex logic more efficiently. #javascript #webdevelopment #frontend #codingtips #programming
To view or add a comment, sign in
-
-
🔁 Understanding Loops in JavaScript — A Quick Guide Loops are fundamental in JavaScript when you need to execute a block of code multiple times. Choosing the right loop can make your code more readable and efficient. Here are the most common types of loops in JavaScript 👇 1️⃣ "for" Loop – Best when you know how many times the loop should run. for (let i = 0; i < 5; i++) { console.log("Iteration:", i); } 2️⃣ "while" Loop – Runs as long as the condition remains true. let i = 0; while (i < 5) { console.log("Count:", i); i++; } 3️⃣ "do...while" Loop – Executes at least once before checking the condition. let i = 0; do { console.log("Value:", i); i++; } while (i < 5); 4️⃣ "for...of" Loop – Perfect for iterating over iterable objects like arrays, strings, or maps. const fruits = ["Apple", "Banana", "Mango"]; for (const fruit of fruits) { console.log(fruit); } 5️⃣ "for...in" Loop – Used to iterate over object keys. const user = { name: "Sujit", role: "Frontend Developer" }; for (let key in user) { console.log(key, user[key]); } 💡 Quick Tip: Use "for...of" for arrays and "for...in" for objects to keep your code clean and readable. Mastering loops helps you handle data structures, API responses, and complex logic more efficiently. #javascript #webdevelopment #frontend #codingtips #programming
To view or add a comment, sign in
-
Most developers don’t struggle with JavaScript. They struggle with "this". And honestly… that’s fair. Because this is not about where code is written. It’s about: • How a function is defined • How it is called • What execution context it runs in After breaking down strict mode, browser vs Node behavior, arrow functions, IIFEs, and nested execution contexts — I finally structured everything into one mental model. I wrote a deep dive covering: - Execution Context - Call-site Rules - Arrow vs Normal Functions - Strict Mode Differences - ES Modules vs CommonJS - 22-step Output Prediction Challenge If you can predict every output in the final challenge, you’ve mastered this. #JavaScript #WebDevelopment #Frontend #Programming #SoftwareEngineering #NodeJS #ES6 #Coding
To view or add a comment, sign in
-
Day 25: Currying in JavaScript 🍛 Currying sounds complicated… But it’s actually a powerful functional programming technique. 🔹 What is Currying? Currying is: Transforming a function that takes multiple arguments into a sequence of functions that take one argument at a time. Instead of this 👇 function add(a, b, c) { return a + b + c; } add(2, 3, 4); // 9 We do this 👇 function add(a) { return function (b) { return function (c) { return a + b + c; }; }; } add(2)(3)(4); // 9 One argument at a time 🔹 Why Use Currying? ✔ Improves reusability ✔ Helps create specialized functions ✔ Enables function composition ✔ Common in functional programming Real Practical Example function multiply(a) { return function (b) { return a * b; }; } const double = multiply(2); const triple = multiply(3); console.log(double(5)); // 10 console.log(triple(5)); // 15 Here: multiply(2) creates a reusable function That’s powerful abstraction 🔥Modern ES6 Version (Cleaner) const add = a => b => c => a + b + c; add(1)(2)(3); // 6 Short and elegant. 🔹 Currying vs Partial Application 👉 Currying → Always single argument functions 👉 Partial Application → Fix some arguments, not necessarily one by one Example of partial application: function add(a, b) { return a + b; } const add5 = add.bind(null, 5); console.log(add5(10)); // 15 🧠 Interview Insight Currying is possible in JavaScript because: ✔ Functions are first-class citizens ✔ Functions can return functions ✔ Closures preserve outer scope values 🔥 Where It’s Used? Redux Functional libraries like Lodash Middleware patterns Advanced React patterns #JavaScript #Currying #FunctionalProgramming #Frontend #WebDevelopment #LearnInPublic
To view or add a comment, sign in
-
10 Advanced JavaScript Questions Most Devs Can't Answer! If you've mastered the basics it's time to go deeper. Here are 10 advanced JS concepts that separate good developers from great ones 𝟭. 𝗠𝗲𝗺𝗼𝗿𝘆 𝗛𝗲𝗮𝗽 & 𝗚𝗮𝗿𝗯𝗮𝗴𝗲 𝗖𝗼𝗹𝗹𝗲𝗰𝘁𝗶𝗼𝗻 - The JS engine uses mark-and-sweep to free unused memory. Know how memory leaks happen and how to avoid them. 𝟮. 𝗪𝗲𝗮𝗸𝗠𝗮𝗽 & 𝗪𝗲𝗮𝗸𝗦𝗲𝘁 - Unlike Map/Set, these hold weak references allowing GC to reclaim objects. Great for private data & leak-free caching. 𝟯. 𝗣𝗿𝗼𝘅𝘆 & 𝗥𝗲𝗳𝗹𝗲𝗰𝘁 𝗔𝗣𝗜𝘀 - Intercept and customize fundamental object operations (get, set, delete). This is what powers Vue 3's reactivity system. 𝟰. 𝗚𝗲𝗻𝗲𝗿𝗮𝘁𝗼𝗿𝘀 & 𝗜𝘁𝗲𝗿𝗮𝘁𝗼𝗿𝘀 - Functions that can pause and resume execution. They enable lazy evaluation, infinite sequences and they're the foundation of async/await. 𝟱. 𝗧𝗲𝗺𝗽𝗼𝗿𝗮𝗹 𝗗𝗲𝗮𝗱 𝗭𝗼𝗻𝗲 (𝗧𝗗𝗭) - let and const ARE hoisted but accessing them before declaration throws a ReferenceError. That window is the TDZ. 𝟲. 𝗖𝘂𝗿𝗿𝘆𝗶𝗻𝗴 & 𝗣𝗮𝗿𝘁𝗶𝗮𝗹 𝗔𝗽𝗽𝗹𝗶𝗰𝗮𝘁𝗶𝗼𝗻 - Break multi-argument functions into chains of single-argument calls. The backbone of functional programming in JS. 𝟳. 𝗠𝗶𝗰𝗿𝗼𝘁𝗮𝘀𝗸 𝘃𝘀 𝗠𝗮𝗰𝗿𝗼𝘁𝗮𝘀𝗸 𝗤𝘂𝗲𝘂𝗲 - Promises resolve in the microtask queue (runs before the next macrotask). setTimeout is a macrotask. Order matters more than you think. 𝟴. 𝗦𝘁𝗿𝘂𝗰𝘁𝘂𝗿𝗮𝗹 𝗦𝗵𝗮𝗿𝗶𝗻𝗴 𝗶𝗻 𝗜𝗺𝗺𝘂𝘁𝗮𝗯𝗶𝗹𝗶𝘁𝘆 - Libraries like Immer don't deep-clone everything they reuse unchanged branches. Efficient immutability at scale. 𝟵. 𝗧𝗮𝗴𝗴𝗲𝗱 𝗧𝗲𝗺𝗽𝗹𝗮𝘁𝗲 𝗟𝗶𝘁𝗲𝗿𝗮𝗹𝘀 - Process template strings with a custom function at parse time. This is how styled-components, GraphQL, and i18n libraries work. 𝟭𝟬. 𝗣𝗿𝗼𝘁𝗼𝘁𝘆𝗽𝗲 𝗣𝗼𝗹𝗹𝘂𝘁𝗶𝗼𝗻 - Malicious code can inject properties into Object.prototype, corrupting all objects. A real CVE-level security risk ,learn how to defend against it.
To view or add a comment, sign in
-
💡 7 JavaScript Tricks I Wish I Knew Earlier....? JavaScript tricks that can save you hours of coding 👇 1️⃣ Convert string → number "const num = +"42"" Cleaner than "Number()" and super quick. --- 2️⃣ Remove duplicates from an array "const unique = [...new Set([1,2,2,3])]" No loops. No libraries. --- 3️⃣ Swap variables instantly "[a, b] = [b, a]" No temporary variable needed. --- 4️⃣ Convert any value to boolean "const isTrue = !!value" A simple trick used everywhere in JS codebases. --- 5️⃣ Flatten arrays "const flat = [1,[2,3]].flat()" Nested arrays? Not a problem anymore. --- 6️⃣ Optional chaining (no more undefined errors) "user?.profile?.name" Your app won't crash if something is missing. --- 7️⃣ Default values using ?? "const name = userName ?? "Guest"" Only uses "Guest" if the value is null or undefined. --- 💬 Be honest… How many did you already know? 1️⃣ – Just started learning 3️⃣ – Pretty comfortable with JavaScript 5️⃣ – Advanced developer 7️⃣ – JavaScript ninja 🥷 Comment your number 👇 ♻️ Save this post so you don’t forget these tricks. Follow for more JavaScript tips every week 🚀 #javascript #webdevelopment #frontend #coding #programming #softwaredevelopment
To view or add a comment, sign in
-
Most developers don’t struggle with JavaScript. They struggle with this. Same function. Different call. Completely different value. That’s why: Code works in one place Breaks in another And interviews get awkward 😅 In Part 8 of the JavaScript Confusion Series, I break down this into 3 simple rules you’ll never forget. No textbook theory. Just a clean mental model. 👉 Read it here: https://lnkd.in/gvc_nG37 💬 Comment THIS if you’ve ever been confused by it. 🔖 Save it for interviews. 🔁 Share with a developer who still avoids this. #javascript #webdevelopment #frontend #programming #reactjs #learnjavascript
To view or add a comment, sign in
-
🚀 JavaScript Fundamentals Series — Part 1 Before learning frameworks, async code, or complex patterns… you need to understand the core building blocks of JavaScript. Everything in JavaScript starts with variables and data types. In this guide you'll learn: • var, let, and const differences • Primitive vs Reference types • How JavaScript stores data in memory • Why type coercion causes weird bugs • Common mistakes developers make If your foundation here is strong, the rest of JavaScript becomes MUCH easier. I wrote a full guide explaining it clearly with diagrams and examples. Read here 👇 https://lnkd.in/dz_TuuVT Hitesh Choudhary Chai Aur Code Piyush Garg Akash Kadlag #javascript #webdevelopment #coding #learnjavascript
To view or add a comment, sign in
-
🚀 Understanding "var" Scope in JavaScript In JavaScript, there are mainly three types of scope: 1️⃣ Global Scope – Variables declared outside any function are accessible everywhere in the program. 2️⃣ Function Scope – Variables declared inside a function can only be used inside that function. 3️⃣ Block Scope – Variables declared inside blocks like "{ }" (for example in "if", "for", etc.) are only accessible inside that block. However, the important thing to remember is: 👉 The "var" keyword only follows Global Scope and Function Scope. ❌ It does NOT follow Block Scope. Let’s look at a simple example: if (true) { var message = "Hello World"; } console.log(message); // Output: Hello World Even though "message" is declared inside the "if" block, we can still access it outside the block. This happens because "var" ignores block scope. Now look at a function example: function test() { var number = 10; console.log(number); // 10 } console.log(number); // Error: number is not defined Here, "number" is declared inside the function, so it cannot be accessed outside the function. ✅ Key Takeaway: - "var" → Global Scope + Function Scope - "var" ❌ does not support Block Scope That’s why modern JavaScript developers prefer "let" and "const", because they properly support block scope. #JavaScript #WebDevelopment #Programming #BackendDevelopment
To view or add a comment, sign in
-
10 Advanced JavaScript Questions Most Devs Can't Answer! If you've mastered the basics it's time to go deeper. Here are 10 advanced JS concepts that separate good developers from great ones 𝟭. 𝗠𝗲𝗺𝗼𝗿𝘆 𝗛𝗲𝗮𝗽 & 𝗚𝗮𝗿𝗯𝗮𝗴𝗲 𝗖𝗼𝗹𝗹𝗲𝗰𝘁𝗶𝗼𝗻 - The JS engine uses mark-and-sweep to free unused memory. Know how memory leaks happen and how to avoid them. 𝟮. 𝗪𝗲𝗮𝗸𝗠𝗮𝗽 & 𝗪𝗲𝗮𝗸𝗦𝗲𝘁 - Unlike Map/Set, these hold weak references allowing GC to reclaim objects. Great for private data & leak-free caching. 𝟯. 𝗣𝗿𝗼𝘅𝘆 & 𝗥𝗲𝗳𝗹𝗲𝗰𝘁 𝗔𝗣𝗜𝘀 - Intercept and customize fundamental object operations (get, set, delete). This is what powers Vue 3's reactivity system. 𝟰. 𝗚𝗲𝗻𝗲𝗿𝗮𝘁𝗼𝗿𝘀 & 𝗜𝘁𝗲𝗿𝗮𝘁𝗼𝗿𝘀 - Functions that can pause and resume execution. They enable lazy evaluation, infinite sequences and they're the foundation of async/await. 𝟱. 𝗧𝗲𝗺𝗽𝗼𝗿𝗮𝗹 𝗗𝗲𝗮𝗱 𝗭𝗼𝗻𝗲 (𝗧𝗗𝗭) - let and const ARE hoisted but accessing them before declaration throws a ReferenceError. That window is the TDZ. 𝟲. 𝗖𝘂𝗿𝗿𝘆𝗶𝗻𝗴 & 𝗣𝗮𝗿𝘁𝗶𝗮𝗹 𝗔𝗽𝗽𝗹𝗶𝗰𝗮𝘁𝗶𝗼𝗻 - Break multi-argument functions into chains of single-argument calls. The backbone of functional programming in JS. 𝟳. 𝗠𝗶𝗰𝗿𝗼𝘁𝗮𝘀𝗸 𝘃𝘀 𝗠𝗮𝗰𝗿𝗼𝘁𝗮𝘀𝗸 𝗤𝘂𝗲𝘂𝗲 - Promises resolve in the microtask queue (runs before the next macrotask). setTimeout is a macrotask. Order matters more than you think. 𝟴. 𝗦𝘁𝗿𝘂𝗰𝘁𝘂𝗿𝗮𝗹 𝗦𝗵𝗮𝗿𝗶𝗻𝗴 𝗶𝗻 𝗜𝗺𝗺𝘂𝘁𝗮𝗯𝗶𝗹𝗶𝘁𝘆 - Libraries like Immer don't deep-clone everything they reuse unchanged branches. Efficient immutability at scale. 𝟵. 𝗧𝗮𝗴𝗴𝗲𝗱 𝗧𝗲𝗺𝗽𝗹𝗮𝘁𝗲 𝗟𝗶𝘁𝗲𝗿𝗮𝗹𝘀 - Process template strings with a custom function at parse time. This is how styled-components, GraphQL, and i18n libraries work. 𝟭𝟬. 𝗣𝗿𝗼𝘁𝗼𝘁𝘆𝗽𝗲 𝗣𝗼𝗹𝗹𝘂𝘁𝗶𝗼𝗻 - Malicious code can inject properties into Object.prototype, corrupting all objects. A real CVE-level security risk ,learn how to defend against it. Follow the Frontend Circle By Sakshi channel on WhatsApp: https://lnkd.in/gj5dp3fm 𝗙𝗼𝗹𝗹𝗼𝘄𝘀 𝘂𝘀 𝗵𝗲𝗿𝗲 → https://lnkd.in/geqez4re
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 for putting us on people’s radar 💚