Map и Set

Кроме объектов и массивов, в JavaScript есть ещё две встроенные коллекции. Map — это словарь «ключ → значение», а Set — набор значений без повторов. Коллекцией называют любое значение, которое хранит много других значений.

Map: создание и чтение

Map создают через new Map(). Метод set() кладёт значение под ключ, а get() достаёт его:

const prices = new Map();
 
prices.set('чай', 5);
 
console.log(prices.get('чай')); // 5

Если ключа нет, get() вернёт undefined.

Методы Map

Свойство size хранит количество записей, has() проверяет наличие ключа, а delete() удаляет запись. Начальные данные можно передать сразу — массивом пар:

const prices = new Map([
  ['чай', 5],
  ['кофе', 12],
]);
 
prices.delete('чай');
 
console.log(prices.size);        // 1
console.log(prices.has('кофе')); // true

Перебор Map

Map перебирают циклом for...of. Каждый шаг даёт пару [ключ, значение], и записи идут в порядке добавления:

const prices = new Map([
  ['чай', 5],
  ['кофе', 12],
]);
 
for (const [title, price] of prices) {
  console.log(`${title}: ${price} €`);
}
// чай: 5 €
// кофе: 12 €

Главное отличие от объекта — ключом Map может быть значение любого типа: число, объект, даже функция. У обычного объекта ключи всегда строки.

Set: уникальные значения

Set хранит каждое значение только один раз. Метод add() добавляет значение, а повторное добавление ничего не меняет:

const tags = new Set();
 
tags.add('js');
tags.add('css');
tags.add('js');
 
console.log(tags.size); // 2

Как и у Map, у Set есть методы has() и delete().

Убрать повторы из массива

Самый частый приём с Set — удалить дубликаты из массива. Массив передают в new Set(), а результат раскрывают обратно в массив через ...:

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

Частая ошибка

В Map нельзя записывать через квадратные скобки, как в обычный объект. Такое присваивание создаёт свойство у самого объекта Map, а записи в словаре не появляется:

const prices = new Map();
 
prices['чай'] = 5;
 
console.log(prices.size);       // 0
console.log(prices.get('чай')); // undefined

Для Map всегда используйте set() и get().