🎲

JavaScript Sets

Store unique values and perform set operations

⭐ Data Structure

What are Sets?

Sets are collections of unique values - no duplicates allowed! Perfect for finding unique ingredients across multiple recipes, removing duplicate items from shopping lists, or tracking which dishes a customer has ordered.

💡 Real-World Example:

Remove duplicates from shopping list: ["eggs", "milk", "eggs", "bread"] → Set { "eggs", "milk", "bread" }

Working with Sets

1. Creating Sets 

const ingredients = new Set();
ingredients.add("flour");
ingredients.add("sugar");
ingredients.add("flour");  // Duplicate - won't be added
console.log(ingredients.size);  // 2 (not 3!)

2. Creating from Arrays 

const items = ["egg", "milk", "egg", "bread", "milk"];
const unique = new Set(items);
console.log(unique);  // Set { "egg", "milk", "bread" }
console.log([...unique]);  // Convert back to array

3. Checking and Deleting 

const pantry = new Set(["flour", "sugar", "salt"]);
console.log(pantry.has("sugar"));  // true
pantry.delete("salt");
console.log(pantry.has("salt"));   // false

4. Iterating Over Sets 

const dishes = new Set(["pasta", "pizza", "salad"]);
for (const dish of dishes) {
    console.log(dish);
}

5. Set Operations 

const recipe1 = new Set(["flour", "sugar", "eggs"]);
const recipe2 = new Set(["eggs", "milk", "butter"]);

// Union (combine)
const all = new Set([...recipe1, ...recipe2]);

// Intersection (common items)
const common = [...recipe1].filter(x => recipe2.has(x));
console.log(common);  // ["eggs"]

➕ add(value)

set.add("item");
// Returns the Set

✅ has(value)

set.has("item");
// Returns true or false

❌ delete(value) 

set.delete("item");
// Returns true if deleted

🗑️ clear()

set.clear();
// Removes all elements

Learn More

📘 MDN Web Docs 📗 W3Schools

🚀 Try It Yourself

Output:

🔍

Game 1: Unique Ingredients Finder

Find all unique ingredients across multiple recipes! Practice Set operations like union, intersection, and difference.

📝 Recipe Lists

🍰 Recipe A: Cake
🍪 Recipe B: Cookies

📊 Analysis Results

🧹

Game 2: Duplicate Remover

Clean up messy ingredient lists by removing duplicates! Practice using Sets to ensure unique values.

📋 Input List (with duplicates)

✨ Cleaned List (unique items)

📊 Statistics:
✨

Challenge 1: Unique Ingredients Finder

📋 Your Mission:

Find all unique ingredients across multiple recipes:

  1. Combine all ingredient arrays into one
  2. Use a Set to get unique values
  3. Return sorted array of unique ingredients

Example:

findUniqueIngredients([["flour", "sugar"], ["sugar", "eggs"], ["flour"]])

→ ["eggs", "flour", "sugar"] (sorted alphabetically)

💡 Hints:

  • Flatten arrays: recipes.flat()
  • Create Set: new Set(array)
  • Convert back and sort: [...set].sort()

Test Results:

🧹

Challenge 2: Duplicate Remover

📋 Your Mission:

Clean up a shopping list by removing duplicates and return statistics:

  1. Remove duplicate items from the list
  2. Count how many duplicates were removed
  3. Return object with cleaned list and duplicate count

Example:

removeDuplicates(["egg", "milk", "egg", "bread", "milk", "egg"])

→ { cleanList: ["egg", "milk", "bread"], duplicatesRemoved: 3 }

💡 Hints:

  • Original length - Set size = duplicates
  • Convert Set to array: [...set]
  • Return object with both values

Test Results: