Запропонувати правку

Покращити цю статтю

Допрацюйте відповідь до «Що таке Map?». Ваші зміни проходять модерацію перед публікацією.

Потрібне підтвердження

Контент

Що ви змінюєте

Заголовок (UA)

Коротка відповідь (UA)

Показується над повною відповіддю для швидкого нагадування.

Відповідь (UA)

## Що таке Map

> `Map` - це вбудований об'єкт у JavaScript, який зберігає **пари "ключ → значення"**
> і **запам'ятовує порядок вставки** цих пар.

Він схожий на звичайний об'єкт `{}`, але з **розширеними можливостями**:

- може використовувати **будь-який тип даних як ключ** (зокрема об'єкти, функції, NaN);
- має зручні методи для додавання, видалення та перебору;
- зберігає **порядок вставки елементів**.

## Приклад використання

```javascript
const map = new Map();

map.set('name', 'Alex');
map.set('age', 25);

console.log(map.get('name')); // Alex
console.log(map.get('age'));  // 25
console.log(map.size);        // 2
```

## Основні методи та властивості Map

| Метод / властивість | Що робить | Приклад |
|---|---|---|
| `set(key, value)` | Додає елемент | `map.set('a', 1)` |
| `get(key)` | Повертає значення за ключем | `map.get('a')` |
| `has(key)` | Перевіряє наявність ключа | `map.has('a') // true` |
| `delete(key)` | Видаляє елемент | `map.delete('a')` |
| `clear()` | Очищає всю колекцію | `map.clear()` |
| `size` | Кількість елементів | `map.size // 2` |

## Приклад: різні типи ключів

```javascript
const map = new Map();

const objKey = { id: 1 };
const funcKey = () => {};
const numKey = 42;

map.set(objKey, 'об\'єкт');
map.set(funcKey, 'функція');
map.set(numKey, 'число');

console.log(map.get(objKey)); // об'єкт
console.log(map.get(funcKey)); // функція
console.log(map.get(42)); // число
```

На відміну від звичайного об'єкта `{}`, ключі тут **порівнюються за посиланням**,
а не за приведеною до рядка формою.

## Приклад з NaN та об'єктами

```javascript
const map = new Map();
map.set(NaN, 'Not a Number');
console.log(map.get(NaN)); // 'Not a Number'
```

Навіть `NaN` працює як ключ (у звичайних об'єктах це неможливо).

## Перебір Map

`Map` - **колекція, що ітерується**, тому її можна обійти будь-якими способами:

### 1. for...of

```javascript
const map = new Map([
  ['name', 'Alex'],
  ['age', 25],
]);

for (const [key, value] of map) {
  console.log(`${key}: ${value}`);
}
// name: Alex
// age: 25
```

### 2. Методи ітерації:

```javascript
map.forEach((value, key) => {
  console.log(key, value);
});
```

### 3. Отримати ключі / значення / записи:

```javascript
console.log([...map.keys()]);   // ['name', 'age']
console.log([...map.values()]); // ['Alex', 25]
console.log([...map.entries()]); // [['name','Alex'], ['age',25]]
```

## Порівняння з об'єктом {}

| Особливість | `Object` | `Map` |
|---|---|---|
| Тип ключів | Тільки рядок або символ | Будь-який тип (включно з об'єктами й функціями) |
| Порядок елементів | Не гарантований (до ES2015) | Гарантований |
| Кількість елементів | Потрібно рахувати вручну (`Object.keys().length`) | `map.size` |
| Видалення | `delete obj.key` (повільно) | `map.delete(key)` (швидко) |
| Перебір | `for...in` (з успадкованими властивостями) | Чистий `for...of` |
| Продуктивність | Краще для невеликих наборів даних | Краще для частих вставок/видалень |

## Перетворення між Map та об'єктом

### З об'єкта → в Map:

```javascript
const obj = { a: 1, b: 2 };
const map = new Map(Object.entries(obj));
```

### З Map → в об'єкт:

```javascript
const obj2 = Object.fromEntries(map);
```

## Приклад практичного використання

### Лічильник елементів, що зустрічаються:

```javascript
const arr = ['a', 'b', 'a', 'c', 'b', 'a'];

const counter = new Map();

for (const item of arr) {
  counter.set(item, (counter.get(item) || 0) + 1);
}

console.log(counter); // Map(3) { 'a' => 3, 'b' => 2, 'c' => 1 }
```

## Коли використовувати Map

Використовуй `Map`, якщо:

- потрібно зберігати **не лише рядки** як ключі;
- важливо **зберігати порядок вставки**;
- потрібне **часте додавання й видалення** елементів;
- ти працюєш з **асоціативними структурами даних**.

## Коротке резюме

| Що | Опис |
|---|---|
| **Тип** | Колекція "ключ-значення" |
| **Ключі** | Будь-які типи (включно з об'єктами) |
| **Порядок** | Зберігається |
| **Методи** | `.set()`, `.get()`, `.has()`, `.delete()`, `.clear()` |
| **Розмір** | `map.size` |
| **Перебір** | `for...of`, `.forEach()`, `.keys()`, `.values()`, `.entries()` |

Простіше кажучи:

> `Map` - це покращена версія об'єкта `{}`
> з нормальними методами, підтримкою будь-яких ключів
> і гарантованим порядком елементів.

Markdown · перетягуйте зображення · ⌘B / ⌘I шорткати620 слів

Для рев’юера

Примітка для модератора (необов’язково)

Бачить лише модератор. Прискорює рев’ю.