Работа с ассоциативными массивами в 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
отлично подходят для ситуаций, когда необходим автоматический сбор мусора и ключами являются объекты.
Полезные материалы
- Работа с объектами – JavaScript | MDN — глубокое погружение в категорию объектов JavaScript.
- Понимание объектов в JavaScript | DigitalOcean — легкий подход к пониманию объектов в JavaScript.
- Map – JavaScript | MDN — полезное руководство по работе с объектами Map.
- Map и Set – JavaScript Info — интересные примеры использования Map и Set в JavaScript.
- JSON — универсальный формат для обмена данными.
- Введение в JSON — как правильно использовать JSON в JavaScript.