webroad.online
  1. 1Веб
  2. 2HTML
  3. 3CSS
  4. 4JavaScript
  5. 5TypeScript
  6. 6Git
  7. 7Инструменты
  8. 8React
  9. 9Стейт-менеджмент
  10. 10Next.js
  11. 11Формы
  12. 12Данные и бэкенд
  13. 13SEO
  14. 14Tailwind CSS
  15. 15Анимации
  16. 16Тестирование
  17. 17Архитектура
JavaScript · Урок 11 из 17

Map и Set

Коллекции уникальных значений и словари с ключами любого типа.

Обновлено

Что такое Map и Set

Две нативные коллекции помимо массива и объекта:

  • Set — коллекция уникальных значений. Без ключей, без дубликатов.
  • Map — словарь ключ → значение, как объект, но ключом может быть что угодно (в том числе объект), и он оптимизирован для частых добавлений и удалений.

Set

const tags = new Set(['js', 'css', 'js'])
tags.size            // 2 — дубликат исчез
tags.has('css')      // true — очень быстрая проверка
tags.add('html')
tags.delete('css')

for (const tag of tags) {}         // итерируемый
const unique = [...new Set(arr)]   // классический рецепт: убрать дубликаты

Операции над множествами (нативные с 2024 года):

a.union(b)         // объединение
a.intersection(b)  // что общего
a.difference(b)    // что есть в a, но нет в b
a.isSubsetOf(b)

Map

const cache = new Map()
cache.set('user:1', { name: 'Ana' })
cache.set(domElement, metadata)     // ключом может быть объект!
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))         // из объекта
Object.fromEntries(map)              // обратно в объект

Какая коллекция когда — сравнение

Нужно... Используйте Почему
упорядоченный список, возможны дубликаты Array индексы, map/filter, JSON
уникальные значения / «уже видел?» Set мгновенный has, без дубликатов
описание одной вещи с фиксированными полями Object короткий синтаксис, JSON, деструктуризация
динамический словарь, ключи часто добавляются / удаляются Map производительность, size, гарантированный порядок
ключи-объекты Map объекты как ключи в {} не работают

Map и объект подробнее

Объект {} Map
Тип ключей string / symbol (числа становятся строками) любой
Порядок ключей почти всегда порядок вставки (числа первыми) всегда порядок вставки
Размер Object.keys(o).length .size
Перебор Object.entries(o) напрямую for...of
JSON напрямую нужно преобразовать
Случайно унаследованные ключи (toString) возможны нет

Set или array.includes

arr.includes(x) проходит весь массив при каждом вызове. set.has(x) — практически мгновенно. Разница важна, когда часто проверяете по большому списку:

const passed = new Set(passedIds)          // один раз
exercises.filter(e => passed.has(e.id))    // быстро для каждого

Именно так это приложение считает ваш прогресс.

WeakMap и WeakSet

Варианты, где ключи удерживаются «слабо»: если объект-ключ больше нигде не используется, сборщик мусора удалит его автоматически. Для метаданных, привязанных к объектам (например, DOM-узлам), без утечки памяти. Не итерируемые.

Коротко

  • Set = уникальные значения, быстрый has; Map = словарь с ключами любого типа.
  • Объект — для фиксированных данных / JSON; Map — для динамических коллекций и кэша.
  • new Set(arr) — для дубликатов и быстрых проверок.

Официальные источники

Упражнения

Была ли страница полезной?

Один клик — без регистрации.