JavaScript Map and Set: Choosing Between Key-Value Collections and Unique Values

const userRoles = new Map();
// ✏️ set(key, value) — add or update:
userRoles.set("priya", "admin");
userRoles.set("amit", "editor");
userRoles.set("riya", "viewer");
// 📖 get(key) — read:
console.log(userRoles.get("priya"));
// "admin"
console.log(userRoles.get("nobody"));
// undefined — missing key
// ❓ has(key) — existence check:
console.log(userRoles.has("amit"));
// true
console.log(userRoles.has("guest"));
// false
// 🗑️ delete(key) — remove:
userRoles.delete("riya");
// 📏 size — how many entries (a PROPERTY, not a method!):
console.log(userRoles.size);
// 2

const map = new Map();
map.set(1, "number key");
// 🔢 numbers
map.set("1", "string key");
// 🔤 strings — kept SEPARATE!
map.set(true, "boolean key");
// ✅ booleans
map.set( {
  id: 1
}, "object key! 😮");
// 📦 even objects
map.set(() => {
}, "function key! 🤯");
// ⚙️ and functions
console.log(map.get(1));
// "number key"
console.log(map.get("1"));
// "string key" — different key, different value ✅

const clickCounts = new Map();
const btn = document.querySelector("#myBtn");
clickCounts.set(btn, 0);
// a DOM element as a key! 🎯
clickCounts.set(btn, clickCounts.get(btn) + 1);

const scores = new Map([["Priya", 95],["Amit", 88]]);
// initialize with pairs!
for (const[name, score] of scores) {
  // destructuring in for…of ✨
  console.log(`${name}: ${score}`);
}// Priya: 95
// Amit: 88
scores.forEach((score, name) => console.log(name, score));
// note: value first!
scores.keys();
// iterator of keys
scores.values();
// iterator of values
scores.entries();
// iterator of [key, value] pairs

const m = new Map();
m.set("z-first", 1);
m.set("a-second", 2);
for (const key of m.keys()) {
  console.log(key);
  // "z-first", "a-second" — insertion order preserved ✅
}

// 📦 A record → object:const user = { name: "Priya", age: 22, greet() {…} };
// 🗺️ A dictionary → Map:const cache = new Map();              // keys appear/disappear all daycache.set("/api/user", responseData);

const uniqueTags = new Set();
uniqueTags.add("javascript");
uniqueTags.add("webdev");
uniqueTags.add("javascript");
// 🚫 duplicate — silently ignoreduniqueTags.add("javascript");        // 🚫 still ignored!
console.log(uniqueTags.size);
// 2 — only uniques survive ✅

const set = new Set([10, 20, 20, 30]);
// initialize from an array…
console.log(set.size);
// 3 — the duplicate 20 vanished instantly ✨
set.add(40);
// ➕ addset.has(20);                  // ❓ true — existence check (FAST!)set.delete(10);               // 🗑️ removeset.clear();                  // 🧹 empty it completely

const colors = new Set(["red", "green", "blue"]);
for (const color of colors) {
  // for…of works directly ✅  console.log(color);}
  colors.forEach(color => console.log(color));
  const arr =[...colors];
  // spread → array (Lesson 14!) 

const numbers =[1, 2, 2, 3, 3, 3, 4, 4, 4, 4];
const unique =[...new Set(numbers)];
console.log(unique);
// [1, 2, 3, 4] ✨

const admins = new Set(["priya", "karan", "meera"]);
function canDeletePost(username) {
  return admins.has(username);
  // instant answer — no scanning! ⚡
}console.log(canDeletePost("priya"));
// true
console.log(canDeletePost("amit"));
// false

const teamA = new Set(["Priya", "Amit", "Riya"]);
const teamB = new Set(["Amit", "Karan", "Riya"]);
// UNION — everyone from both teams:
const everyone = new Set([...teamA, ...teamB]);
console.log([...everyone]);
// Priya, Amit, Riya, Karan ✅
// INTERSECTION — only in BOTH:
const both =[...teamA].filter(name => teamB.has(name));
console.log(both);
// ["Amit", "Riya"] ✅
// DIFFERENCE — in A but NOT in B:
const onlyA =[...teamA].filter(name => !teamB.has(name));
console.log(onlyA);
// ["Priya"] ✅

// 📦 A record → object:const user = { name: "Priya", age: 22, greet() {…} };
// 🗺️ A dictionary → Map:const cache = new Map();              // keys appear/disappear all daycache.set("/api/user", responseData);

const uniqueTags = new Set();
uniqueTags.add("javascript");
uniqueTags.add("webdev");
uniqueTags.add("javascript");
// 🚫 duplicate — silently ignoreduniqueTags.add("javascript");        // 🚫 still ignored!
console.log(uniqueTags.size);
// 2 — only uniques survive ✅

const set = new Set([10, 20, 20, 30]);
// initialize from an array…
console.log(set.size);
// 3 — the duplicate 20 vanished instantly ✨
set.add(40);
// ➕ addset.has(20);                  // ❓ true — existence check (FAST!)set.delete(10);               // 🗑️ removeset.clear();                  // 🧹 empty it completely

const colors = new Set(["red", "green", "blue"]);
for (const color of colors) {
  // for…of works directly ✅  console.log(color);}
  colors.forEach(color => console.log(color));
  const arr =[...colors];
  // spread → array (Lesson 14!) 

const numbers =[1, 2, 2, 3, 3, 3, 4, 4, 4, 4];
const unique =[...new Set(numbers)];
console.log(unique);
// [1, 2, 3, 4] ✨

const admins = new Set(["priya", "karan", "meera"]);
function canDeletePost(username) {
  return admins.has(username);
  // instant answer — no scanning! ⚡
}console.log(canDeletePost("priya"));
// true
console.log(canDeletePost("amit"));
// false

const teamA = new Set(["Priya", "Amit", "Riya"]);
const teamB = new Set(["Amit", "Karan", "Riya"]);
// UNION — everyone from both teams:
const everyone = new Set([...teamA, ...teamB]);
console.log([...everyone]);
// Priya, Amit, Riya, Karan ✅
// INTERSECTION — only in BOTH:
const both =[...teamA].filter(name => teamB.has(name));
console.log(both);
// ["Amit", "Riya"] ✅
// DIFFERENCE — in A but NOT in B:
const onlyA =[...teamA].filter(name => !teamB.has(name));
console.log(onlyA);
// ["Priya"] ✅

// 🗳️ Poll Analytics — votes with duplicate protection
const votes = new Map();
// option → vote count
const voters = new Set();
// who already voted (no double-voting!)
function castVote(voterId, option) {
  if (voters.has(voterId)) {
    // ⚡ instant membership check
    console.log(`🚫 ${voterId} already voted!`);
    return;
  } voters.add(voterId);
  // register the voter
  votes.set(option,(votes.get(option) ?? 0) + 1);
  // ?? from Lesson 6! ✨
  console.log(`✅ ${voterId} voted for "${option}"`);
}function showResults() {
  console.log("\n📊 RESULTS:");
  for (const[option, count] of votes) {
    // Map iteration ✨
    const bar = "█".repeat(count);
    console.log(`${option.padEnd(12)} ${bar} ${count}`);
  } console.log(`Total voters: ${voters.size}`);
}castVote("user1", "JavaScript");
castVote("user2", "Python");
castVote("user3", "JavaScript");
castVote("user1", "Python");
// 🚫 blocked — already voted!
castVote("user4", "JavaScript");
showResults();

✅ user1 voted for "JavaScript"✅ user2 voted for "Python"✅ user3 voted for "JavaScript"🚫 user1 already voted!✅ user4 voted for "JavaScript"📊 RESULTS:JavaScript ███ 3Python █ 1Total voters: 4