webroad.online
  1. 1Web
  2. 2HTML
  3. 3CSS
  4. 4JavaScript
  5. 5TypeScript
  6. 6Git
  7. 7Unelte
  8. 8React
  9. 9State management
  10. 10Next.js
  11. 11Formulare
  12. 12Date și backend
  13. 13SEO
  14. 14Tailwind CSS
  15. 15Animații
  16. 16Testare
  17. 17Arhitectură
JavaScript · Lecția 11 din 17

Map și Set

Colecții cu valori unice și dicționare cu orice tip de cheie.

Actualizat

Ce sunt Map și Set

Două colecții native, pe lângă array și obiect:

  • Set — o colecție de valori unice. Nu are chei, nu are duplicate.
  • Map — un dicționar cheie → valoare, ca un obiect, dar cheia poate fi orice (inclusiv obiecte) și e optimizat pentru adăugări și ștergeri dese.

Set

const tags = new Set(['js', 'css', 'js'])
tags.size            // 2 — duplicatul a dispărut
tags.has('css')      // true — verificare foarte rapidă
tags.add('html')
tags.delete('css')

for (const tag of tags) {}         // iterabil
const unique = [...new Set(arr)]   // rețeta clasică: elimină duplicatele

Operații de mulțimi (native din 2024):

a.union(b)         // reuniune
a.intersection(b)  // ce au în comun
a.difference(b)    // ce e în a, dar nu în b
a.isSubsetOf(b)

Map

const cache = new Map()
cache.set('user:1', { name: 'Ana' })
cache.set(domElement, metadata)     // cheia poate fi un obiect!
cache.get('user:1')
cache.has('user:1')
cache.delete('user:1')
cache.size

for (const [key, value] of cache) {}
new Map(Object.entries(obj))         // din obiect
Object.fromEntries(map)              // înapoi în obiect

Când ce colecție — comparație

Ai nevoie de... Folosește De ce
listă ordonată, cu duplicate posibile Array index, map/filter, JSON
valori unice / „am văzut deja?” Set has instant, fără duplicate
descrierea unui lucru cu câmpuri fixe Obiect sintaxă scurtă, JSON, destructuring
dicționar dinamic, chei adăugate / șterse des Map performanță, size, ordine garantată
chei care sunt obiecte Map obiectele ca chei nu merg în {}

Map vs obiect, în detaliu

Obiect {} Map
Tipul cheilor string / symbol (numerele devin string) orice
Ordinea cheilor aproape mereu inserare (numerele întâi) mereu ordinea inserării
Mărime Object.keys(o).length .size
Iterare Object.entries(o) direct for...of
JSON direct trebuie convertit
Chei moștenite accidental (toString) posibil nu

Set vs array.includes

arr.includes(x) parcurge tot array-ul la fiecare apel. set.has(x) e practic instantaneu. Diferența contează când verifici des într-o listă mare:

const passed = new Set(passedIds)          // o dată
exercises.filter(e => passed.has(e.id))    // rapid pentru fiecare

Exact așa calculează aplicația asta progresul tău.

WeakMap și WeakSet

Variante în care cheile sunt ținute „slab”: dacă obiectul-cheie nu mai e folosit nicăieri, e șters automat de garbage collector. Pentru metadate atașate obiectelor (ex. noduri DOM) fără memory leak. Nu sunt iterabile.

Pe scurt

  • Set = valori unice, has rapid; Map = dicționar cu orice tip de cheie.
  • Obiect pentru date fixe / JSON; Map pentru colecții dinamice și cache.
  • new Set(arr) pentru duplicate și verificări rapide.

Surse oficiale

Exerciții

Ți-a fost utilă pagina?

Un click — fără cont.