Как создавать словари в JavaScript

Обзор типа данных объекта

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

Однако, в отличие от статически типизированных языков, в JavaScript нет такого типа, как Dictionary. Как же его создать? У вас есть несколько вариантов.

Создание словаря в JavaScript

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

// Using the built-in Object
const obj = new Object();

// Using object literals
const obj = {
    key: 'value'
};

Чаще всего используются литералы объектов. Если вам интересно узнать, каковы другие способы создания объектов, посмотрите учебник

Как добавить значения в словарь

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

// Add default values during initialization
const dictionary = {
    PUBLIC_API_KEY: '1c6aa69fb9d27cb4f29c81611d0b1ff5',
    PRIVATE_API_KEY: '4fa758e6d388593f8637da4bdd697ef6'
};

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

// Using an index
dictionary[2] = 'c8b0c9e9b1618b4fb35c47ed4e2fadc7';

// Using bracket notation
dictionary['blue-book'] = '📘';

// Calling the property directly with dot notation
dictionary.book = '📒';

Если теперь вы попытаетесь выйти из dictionary в консоль, то получите следующий результат:

{
    2: "c8b0c9e9b1618b4fb35c47ed4e2fadc7"
    PRIVATE_API_KEY: "4fa758e6d388593f8637da4bdd697ef6"
    PUBLIC_API_KEY: "1c6aa69fb9d27cb4f29c81611d0b1ff5"
    blue-book: "📘"
    book: "📒"
}

Обратите внимание, что в обозначении скобок можно также использовать тире. Это не относится к другим параметрам. Если вы попытаетесь задать его через точечную нотацию, то получите ошибку.

У вас также есть возможность использовать другие переменные в качестве имени для ключей в словаре, используя скобочную нотацию. Просто передайте переменную между скобками.

Обратите внимание, что обозначения скобок внутри объектов доступны только в ES6 и выше:

const key = 'blue-book';
const dictionary = {
    [key]: '📘'
};

// You can also do
dictionary[key] = '📘';

console.log(dictionary);

// The above console.log will output:
{ blue-book: "📘" }

Как получить доступ к ключам

Если вы хотите получить доступ к этим значениям, вы можете использовать те же опции, что и раньше, только без присвоения.

// Will return "c8b0c9e9b1618b4fb35c47ed4e2fadc7"
dictionary[2];

// Will return "📘"
dictionary['blue-book'];

// Will return "📒"
dictionary.book;

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

const key = 'blue-book';

// Will return "📘";
dictionary[key];

Итерация по словарям

Если необходимо просмотреть весь ваш словарь, когда он уже готов к использованию, можно использовать цикл for...in следующим образом:

const dictionary = { ... };

for (const key in dictionary) {
    if (dictionary.hasOwnProperty(key)) {
        // work on properties
        console.log(`key: ${key}, value: ${dictionary[key]}`);
    }
}

Чтобы отфильтровать унаследованные свойства, используйте оператор if, чтобы проверить, принадлежит ли свойство, над которым вы работаете, dictionary. Обратите внимание, что доступ к значениям внутри цикла можно получить с помощью скобочной нотации.

О чем следует помнить

Вот как вы можете создавать словари в JavaScript. Некоторые моменты, о которых следует помнить:

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

• Старайтесь придерживаться одного соглашения об именах, будь то camelCase, snake_case или kebab-case.

• Вы можете использовать переменные для записи и доступа к свойствам.

• Обязательно включайте оператор if внутри for...in, если вы хотите отфильтровать унаследованные свойства.

Спасибо, что дочитали до конца, удачного кодинга!

Материал подготовлен в рамках курса «JavaScript Developer. Professional».

Node.js — это асинхронная среда исполнения JavaScript, в основе которой находятся такие понятия как «Event Loop» и событийно-ориентированная архитектура. 2 года назад основатель Node.js Ryan Dahl заявил о создании Deno (палиндром Node) — альтернативной серверной среды исполнения JavaScript и TypeScript. Некоторые концепции остались схожими, а некоторые были придуманы и воплощены с нуля.

Всех желающих приглашаем на двухдневный онлайн-интенсив «Знакомство и сравнение возможностей Deno и Node.js». Цель интенсива — рассмотреть обе среды с точки зрения ключевых возможностей, паттернов, инструментов. Мы сравним примеры небольших, но актуальных приложений и попробуем понять, что представляет из себя современное Server Side окружение JavaScript / TypeScript. >> РЕГИСТРАЦИЯ