Object.entries(): пары ключей и значений

Назначение

Object.entries возвращает массив пар из собственного перечисляемого строкового ключа и соответствующего значения.

Как это работает

Каждая пара является двухэлементным массивом. Её удобно разобрать деструктуризацией в for…of или map. Унаследованные и символьные свойства в результат не входят.

Пример

const labels={html:'Разметка',css:'Стили'};
const rows=Object.entries(labels).map(([key,value])=>key+': '+value);
console.assert(rows[0]==='html: Разметка');
console.assert(rows.length===2);

Что должно получиться

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

Граница применения и частая ошибка

При выводе ключей и значений в HTML используйте безопасный текстовый вывод. Само получение entries никак не обезвреживает содержимое, поступившее от пользователя.

Самостоятельная проверка

Преобразуйте пары в строки вида «ключ: значение». Затем выведите их через textContent в отдельном DOM-примере, не собирая непроверенный innerHTML.

JavaScript в песочнице этого сайта не выполняется. Перенесите пример в отдельный учебный файл. Сначала проверьте исходный результат, затем измените входные данные; ошибка проверки означает, что результат отличается от ожидаемого.

Связанные материалы

• Типы данных
• Функции
• Отладка в консоли