> Что такое Map и Set в JavaScript (JavaScript)

Короткий ответ

Map и Set - это встроенные коллекции в JavaScript. Map хранит пары "ключ-значение", где ключом может быть любой тип данных, включая объекты и функции. Set хранит только уникальные значения любого типа. Оба предоставляют методы для добавления, удаления и проверки наличия элементов, а также поддерживают итерацию в порядке вставки.

Подробное объяснение

Map - это коллекция, аналогичная обычному объекту, но с важными отличиями:

• ключи могут быть любого типа (объект, число, строка, NaN, undefined), а не только строки или символы
• сохраняется порядок вставки элементов
• имеет свойство size, а не метод Object.keys().length
• легко перебирается через for...of или forEach
• не имеет прототипа, поэтому нет риска конфликтов с унаследованными свойствами

Основные методы Map: set(key, value), get(key), has(key), delete(key), clear(). Также есть keys(), values(), entries() для итерации.

Set - это коллекция уникальных значений. При добавлении дубликата значение игнорируется. Основные методы: add(value), has(value), delete(value), clear(). Для проверки количества элементов используется size.

Обе структуры появились в ES6 и широко используются в современном JavaScript-коде.

На практике

Map удобен, когда нужны сложные ключи или частая операция проверки наличия ключа. Например, для кэширования результатов функций по объекту-аргументу.

Set полезен для удаления дубликатов из массива: [...new Set(arr)]. Также часто используется для хранения набора активных элементов, например, выбранных чекбоксов или подписчиков.

Обе коллекции хорошо работают с for...of и поддерживают деструктуризацию при итерации Map: for (const [key, value] of map).

Пример кода

JAVASCRIPT
// Map
const userRoles = new Map();
const user = { id: 1 };

userRoles.set(user, 'admin');
userRoles.set('guest', 'viewer');

console.log(userRoles.get(user)); // 'admin'
console.log(userRoles.has('guest')); // true
console.log(userRoles.size); // 2

// Set
const numbers = new Set([1, 2, 2, 3, 3, 3]);
console.log(numbers.size); // 3
numbers.add(4);
numbers.delete(2);
console.log(numbers.has(4)); // true

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

Как отвечать на собеседовании

Начни с краткого определения, затем перечисли ключевые отличия от объектов и массивов. Приведи пример использования для каждой структуры. Если спросят про производительность, упомяни, что операции has, add, delete в Set и get, set, has в Map работают за O(1) в среднем. Не углубляйся в детали реализации, если не просят.

Что проверяет интервьюер

Интервьюер проверяет:

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

Типичные ошибки

• путать Map с объектом и пытаться использовать map.key вместо map.get(key)
• забывать, что в Set нельзя получить элемент по индексу
• использовать length вместо size
• не знать, что в Map ключ NaN работает корректно, а сравнение ключей происходит по алгоритму SameValueZero
• пытаться использовать JSON.stringify на Map или Set - они сериализуются в пустые объекты