JS Intermediate

Map и Set

Научиться использовать Map для коллекций ключ/значение (с любыми типами ключей) и Set для хранения уникальных значений.

Средний (Intermediate)

Кратко

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


Подробно

Map: const map = new Map(); map.set('name', 'Анна'); map.set(42, 'число'); map.set(true, 'булево');

console.log(map.get('name')); // 'Анна' console.log(map.size); // 3 console.log(map.has(42)); // true map.delete(true);

Map vs Object:

  • Object: ключи ТОЛЬКО строки/Symbol
  • Map: ключи ЛЮБОЙ тип
  • Map: сохраняет порядок вставки
  • Map: имеет size
  • Map: безопаснее для частых добавлений/удалений

Set: const set = new Set([1, 2, 3, 2, 1]); console.log(set); // Set {1, 2, 3} console.log(set.size); // 3

set.add(4); set.delete(1); console.log(set.has(2)); // true

Set для удаления дубликатов: const arr = [1, 2, 2, 3, 3, 3]; const unique = [...new Set(arr)]; // [1, 2, 3]

Set vs Array:

  • Array: допускает дубликаты, индексы
  • Set: только уникальные, нет индексов
  • Set.has() быстрее Array.includes()

Ментальная модель

Map — как словарь, где можно искать не только по слову, но и по картинке или числу. Set — как мешок без дубликатов: кладёте вещь — если уже есть, ничего не происходит.


Примеры

**Самый простой:**

javascript
const map = new Map();
map.set('name', 'Анна');
map.set(1, 'один');

console.log(map.get('name')); // 'Анна'
console.log(map.size);        // 2
console.log(map.has(1));      // true

Map хранит пары ключ/значение с любыми типами ключей.

**Простой:**

javascript
const set = new Set([1, 2, 2, 3, 3, 3]);
console.log(set); // Set {1, 2, 3}
console.log(set.size); // 3

set.add(4);
set.delete(1);
console.log(set.has(2)); // true

// Удаление дубликатов из массива:
const arr = ['а', 'б', 'а', 'в', 'б'];
const unique = [...new Set(arr)]; // ['а', 'б', 'в']

Set автоматически хранит только уникальные значения.

**Реальный пример:**

javascript
// Map для подсчёта частоты:
function countWords(text) {
  const words = text.toLowerCase().split(/\s+/);
  const freq = new Map();

  for (const word of words) {
    freq.set(word, (freq.get(word) || 0) + 1);
  }

  return freq;
}

const result = countWords('hello world hello');
console.log(result.get('hello')); // 2
console.log(result.get('world')); // 1

Map для подсчёта: ключ — слово, значение — количество.


Частые ошибки

**Неправильно:** Думать, что Map и Object — одно и то же

**Почему:** Map: ключи любых типов, порядок вставки, size, безопасные операции. Object: ключи только строки/Symbol.

**Правильно:** Map для коллекций данных. Object для структур/DTO.

**Неправильно:** Использовать Set как Array

**Почему:** Set не имеет индексов: set[0] не работает. Только set.has(), set.add(), set.delete().

**Правильно:** Set для уникальных значений. Array — для упорядоченных.

**Неправильно:** Забывать, что Map.includes не существует

**Почему:** У Map нет includes. Используйте map.has(key).

**Правильно:** Map: has(). Set: has(). Array: includes().


Важно запомнить

  • Map: ключи любых типов, порядок вставки, size
  • Set: уникальные значения, без индексов
  • Map.has() / Set.has() вместо includes
  • Set для удаления дубликатов: [...new Set(arr)]
  • Map/Object: разные use cases

Связь

Назад: Вы знаете массивы (J13-J17) — теперь у вас есть альтернативные типы коллекций.

Вперёд: Следующий урок (JI19) — итерируемые объекты и протокол итерации.

Материалы курса JS Intermediate — PROlab Academy.