Object.entries() - метод для получения пар ключ-значение объекта в JavaScript

Object.entries() возвращает массив пар [ключ, значение] объекта.

Это очень удобный метод, когда нужны сразу и ключи, и значения, особенно для перебора через for...of, map() или reduce().

Синтаксис

Object.entries(obj)

obj - объект, у которого нужно получить пары ключ-значение.

Что делает Object.entries()

Метод берёт объект и возвращает массив, где каждый элемент - это пара [ключ, значение].

const user = {
  name: "Anna",
  age: 25,
};

console.log(Object.entries(user));
// [["name", "Anna"], ["age", 25]]

Что возвращает Object.entries()

Object.entries() всегда возвращает массив.

Причём внутри этого массива лежат другие массивы из двух элементов:

ключ
значение

const result = Object.entries({ a: 1, b: 2 });

console.log(result); // [["a", 1], ["b", 2]]
console.log(Array.isArray(result)); // true

Это главное, что важно запомнить: результатом будет массив пар.

Только собственные свойства

Object.entries() возвращает только собственные свойства объекта.

Свойства из прототипа в результат не попадают.

const base = { role: "user" };
const person = Object.create(base);

person.name = "Anna";

console.log(Object.entries(person)); // [["name", "Anna"]]

Пара ["role", "user"] сюда не попала, потому что это свойство находится в прототипе.

Только перечисляемые свойства

Метод возвращает только перечисляемые свойства.

Если свойство сделано неперечисляемым, в результат оно не попадёт.

const user = { name: "Anna" };

Object.defineProperty(user, "secret", {
  value: "123",
  enumerable: false,
});

console.log(Object.entries(user)); // [["name", "Anna"]]

Пустой объект

Если у объекта нет своих перечисляемых свойств, метод вернёт пустой массив.

console.log(Object.entries({})); // []

Object.entries() не меняет объект

Метод только читает данные и не изменяет сам объект.

const user = { name: "Anna", age: 25 };
const entries = Object.entries(user);

console.log(user);    // { name: "Anna", age: 25 }
console.log(entries); // [["name", "Anna"], ["age", 25]]

Перебор через for…of

Один из самых удобных сценариев - перебрать объект через деструктуризацию.

const user = {
  name: "Anna",
  age: 25,
};

for (const [key, value] of Object.entries(user)) {
  console.log(key, value);
}

Это читается очень удобно, когда нужны сразу и ключ, и значение.

Преобразование объекта

Object.entries() часто используют, когда объект нужно превратить в массив и обработать как обычные данные.

const scores = {
  math: 90,
  english: 85,
};

const result = Object.entries(scores).map(([key, value]) => {
  return `${key}: ${value}`;
});

console.log(result); // ["math: 90", "english: 85"]

Object.entries(), Object.keys() и Object.values()

Это три близких метода, но возвращают они разное:

Object.keys() - ключи
Object.values() - значения
Object.entries() - пары [ключ, значение]

Пример:

const user = {
  name: "Anna",
  age: 25,
};

console.log(Object.keys(user));    // ["name", "age"]
console.log(Object.values(user));  // ["Anna", 25]
console.log(Object.entries(user)); // [["name", "Anna"], ["age", 25]]

Порядок пар

Пары возвращаются в том же порядке, в котором идут свойства объекта.

const obj = {
  first: 1,
  second: 2,
  third: 3,
};

console.log(Object.entries(obj));
// [["first", 1], ["second", 2], ["third", 3]]

Массивы и Object.entries()

Массив тоже является объектом, поэтому метод работает и с ним.

const arr = ["a", "b", "c"];

console.log(Object.entries(arr));
// [["0", "a"], ["1", "b"], ["2", "c"]]

Важно помнить, что индексы здесь приходят как строки.

Строка как аргумент

Если передать строку, JavaScript обернёт её в объект и вернёт пары индекс-символ.

console.log(Object.entries("hi")); // [["0", "h"], ["1", "i"]]

Для других примитивов результат обычно будет пустым массивом:

console.log(Object.entries(123));  // []
console.log(Object.entries(true)); // []

А вот null и undefined вызовут ошибку:

// Object.entries(null);      // TypeError
// Object.entries(undefined); // TypeError

Символы не попадают в результат

Object.entries() работает только со строковыми перечисляемыми ключами.

Свойства с ключами-символами сюда не входят.

const id = Symbol("id");
const user = {
  name: "Anna",
  [id]: 1,
};

console.log(Object.entries(user)); // [["name", "Anna"]]

Когда это полезно

Object.entries() удобно использовать, когда:

нужны одновременно и ключи, и значения
хочется перебрать объект через for...of
нужно превратить объект в массив для map(), filter() или reduce()

Пример:

const settings = {
  theme: "dark",
  lang: "ru",
};

const lines = Object.entries(settings).map(([key, value]) => `${key}: ${value}`);

console.log(lines); // ["theme: dark", "lang: ru"]

Частые ошибки

Думать, что Object.entries() возвращает объект

const result = Object.entries({ a: 1 });

console.log(result); // [["a", 1]]

Это массив, а не объект.

Путать Object.entries() и Object.values()

const user = { name: "Anna" };

console.log(Object.entries(user)); // [["name", "Anna"]]

Если нужен только список значений, нужен Object.values().

Забывать, что свойства из прототипа не попадают в результат

const base = { role: "user" };
const person = Object.create(base);

person.name = "Anna";

console.log(Object.entries(person)); // [["name", "Anna"]]

Наследуемые свойства сюда не входят.

Быстрая памятка

Object.entries() возвращает массив пар [ключ, значение]
в результат попадают только собственные перечисляемые строковые свойства
свойства из прототипа не попадают
массивы и строки тоже поддерживаются
метод особенно удобен для перебора через деструктуризацию

Коротко

Object.entries() - это удобный способ получить сразу и ключи, и значения объекта. Главное, что стоит запомнить: метод возвращает массив пар [ключ, значение], с которым особенно удобно работать через for...of, map() и reduce().