run-dev

Объект в массив в JavaScript: object в array в JS

Объекты в JavaScript хранят данные в формате ключ-значение, но многие задачи удобнее решать с помощью массивов, например, когда нужно перебрать все элементы, отфильтровать или преобразовать их. Для таких случаев существуют встроенные методы, которые позволяют быстро преобразовать объект в массив — в виде списка ключей, значений или пар [ключ, значение].

Такие операции часто используются при работе с конфигурациями, данными из API и динамическими структурами данных.

Основные способы преобразования объекта в массив

Object.keys — массив ключей

Метод Object.keys() создает массив, содержащий только ключи объекта.

const user = {
    name: 'Alice',
    age: 30,
    city: 'London'
};

const keys = Object.keys(user);
console.log(keys); // ['name', 'age', 'city']

Object.values — массив значений

Метод Object.values() создает массив, содержащий только значения свойств объекта.

const user = {
    name: 'Alice',
    age: 30,
    city: 'London'
};

const values = Object.values(user);
console.log(values); // ['Alice', 30, 'London']

Object.entries — массив пар [ключ, значение]

Метод Object.entries() создает массив вложенных массивов, где каждый элемент — это пара [ключ, значение].

const user = {
    name: 'Alice',
    age: 30,
    city: 'London'
};

const entries = Object.entries(user);
console.log(entries);
// [['name', 'Alice'], ['age', 30], ['city', 'London']]

Пример преобразования объекта в массив объектов

Иногда нужно создать массив, где каждый элемент — это отдельный объект с полями key и value.

const user = {
    name: 'Alice',
    age: 30,
    city: 'London'
};

const arrayOfObjects = Object.entries(user).map(([key, value]) => ({
    key,
    value
}));

console.log(arrayOfObjects);
// [
//     { key: 'name', value: 'Alice' },
//     { key: 'age', value: 30 },
//     { key: 'city', value: 'London' }
// ]

Особенности работы с Object.keys, Object.values и Object.entries

  • Порядок элементов в массиве соответствует порядку свойств объекта.
  • Символьные ключи (Symbol) в массив не попадут.
  • Методы работают только с собственными (не унаследованными) свойствами объекта.

Больше записей