Работа с ассоциативными массивами в JavaScript: аналог Dictionary C#

Быстрый ответ

Создание простых ассоциативных массивов осуществляется с использованием объектов JavaScript, где ключами служат строки:

let fruitHash = { 'apple': 1, 'banana': 2 };
fruitHash['cherry'] = 3; // Добавляем в "фруктовый салат" еще один ингредиент
console.log(fruitHash['apple']); // Найдем наше яблоко

Если требуется расширенная функциональность, например, использование нестроковых ключей или улучшение производительности, используйте Map:

let fruitMap = new Map([['apple', 1], ['banana', 2]]);
fruitMap.set('cherry', 3); // Разнообразим наш фруктовый ассортимент
console.log(fruitMap.get('apple')); // Где же наше яблоко?

В простых ситуациях используйте объекты. При работе с нестроковыми ключами или большим объемом данных предпочтительнее использовать Map.

Расширенные возможности: выходим за рамки основ

Доступ к свойствам объекта

Изменять свойства объектов можно как с помощью точечной нотации, так и через скобочное обращение. В случае использования ключей, содержащих спецсимволы, применяется скобочное обращение.

let obj = { 'one-two': 12, 'three four': 34 };
console.log(obj['one-two']); // Задействуем числа

Подробнее об этом расскажет наш спикер на видео

Перебор ассоциативных массивов

Цикл for..in подойдет для перебора свойств объекта. Не забывайте применять hasOwnProperty, чтобы исключить унаследованные свойства.

for (let fruit in fruitHash) {
  if (fruitHash.hasOwnProperty(fruit)) {
    console.log(fruit + " -> " + fruitHash[fruit]); // Наблюдаем за расширением фруктового ассортимента
  }
}

Повышение производительности с Map

Map обеспечивает большую производительность по сравнению с обычными объектами при работе с большими наборами данных. Время поиска элемента находится в постоянных пределах и не зависит от размера коллекции.

Охватим все случаи: работаем с исключительными ситуациями

Нестроковые ключи? Без проблем

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

Уборка с помощью WeakMap

При необходимости автоматического сбора мусора стоит использовать WeakMap. Ключи в нем — это объекты, которые удаляются из коллекции, если на них не осталось ссылок.

Стальгия по старому доброму Dictionary

Для привыкших к Dictionary из C# или подобных языков, JavaScript предлагает объекты и Map в качестве достойного аналога, хотя они и не являются доскональным эквивалентом.

Визуализация

Представьте, что вы находитесь в художественной галерее, где каждая картина снабжена уникальной табличкой:

| Расположение (Индекс) | Название (Ключ)   | Автор (Значение)        |
| --------------------- | ----------------- | ----------------------- |
| 1                     | «Звёздная ночь»   | Ван Гог                 |
| 2                     | «Тайная вечеря»   | да Винчи                |
| 3                     | «Мона Лиза»       | да Винчи                |
| 4                     | «Крик»            | Мунк                    |

В JavaScript это можно представить как объект, где название служит ключом, а имя художника — значением:

const artGallery = {
  "Starry Night": "Van Gogh",
  "The Last Supper": "Da Vinci",
  "Mona Lisa": "Da Vinci",
  "The Scream": "Munch"
};

Чтобы узнать автора конкретной картины, достаточно обратиться к соответствующему свойству объекта:

let artistOfMonaLisa = artGallery["Mona Lisa"];

И получим:

"да Винчи" // Автор картины "Мона Лиза"

Важно! Сериализация и десериализация

JSON — идеален для обмена данными

Для взаимодействия между клиентом и сервером используйте JSON (JavaScript Object Notation). Работать с JSON в JavaScript можно легко и просто с помощью функций JSON.stringify и JSON.parse.

Сериализация Map

Захотели сохранить Map? Преобразуйте его в массив или объект вручную, а затем сериализуйте:

let serializedMap = JSON.stringify(Array.from(fruitMap.entries())); // Ваши данные сохранены и готовы к передаче

Для восстановления структуры Map:

let deserializedMap = new Map(JSON.parse(serializedMap)); // Карта восстановлена из архивов JSON.

Не забывайте

• Используйте объекты при работе со строковыми и статическими ключами.
• Map подходит для работы с любым объемом данных, где требуется работа с динамическими ключами и частое обновление данных.
• WeakMaps отлично подходят для ситуаций, когда необходим автоматический сбор мусора и ключами являются объекты.

Полезные материалы

1. Работа с объектами – JavaScript | MDN — глубокое погружение в категорию объектов JavaScript.
2. Понимание объектов в JavaScript | DigitalOcean — легкий подход к пониманию объектов в JavaScript.
3. Map – JavaScript | MDN — полезное руководство по работе с объектами Map.
4. Map и Set – JavaScript Info — интересные примеры использования Map и Set в JavaScript.
5. JSON — универсальный формат для обмена данными.
6. Введение в JSON — как правильно использовать JSON в JavaScript.