У объекта нет встроенного “цикла по свойствам” как у массива, но есть методы, которые превращают структуру “ключ - значение” в массивы:
Object.keys(obj)- массив ключейObject.values(obj)- массив значенийObject.entries(obj)- массив пар[key, value]
Дальше эти массивы удобно перебирать через for...of, forEach, map, filter и другие методы массивов.
1) Object.keys: получить ключи
const user = { name: "Sam", age: 20, isActive: true };
const keys = Object.keys(user);
console.log(keys); // ["name", "age", "isActive"]
Ключи всегда строки.
2) Object.values: получить значения
const user = { name: "Sam", age: 20, isActive: true };
const values = Object.values(user);
console.log(values); // ["Sam", 20, true]
3) Object.entries: пары ключ-значение
const user = { name: "Sam", age: 20, isActive: true };
const entries = Object.entries(user);
console.log(entries);
// [["name", "Sam"], ["age", 20], ["isActive", true]]
4) Перебор ключей
const user = { name: "Sam", age: 20 };
for (const key of Object.keys(user)) {
console.log(key, user[key]);
}
// name Sam
// age 20
Здесь user[key] - обязательны квадратные скобки, потому что key - переменная.
5) Перебор значений
const scores = { a: 10, b: 20, c: 15 };
let sum = 0;
for (const value of Object.values(scores)) {
sum += value;
}
console.log(sum); // 45
6) Перебор пар через entries и деструктуризацию
entries часто самый удобный вариант, потому что сразу дает ключ и значение.
const user = { name: "Sam", age: 20 };
for (const [key, value] of Object.entries(user)) {
console.log(key, value);
}
// name Sam
// age 20
7) Преобразования: сделать новый объект из entries
Иногда нужно изменить значения и собрать обратно объект. Удобный путь:
Object.entries->map->Object.fromEntries
const prices = { apple: 10, banana: 20 };
const doubled = Object.fromEntries(
Object.entries(prices).map(([key, value]) => [key, value * 2])
);
console.log(doubled); // { apple: 20, banana: 40 }
8) Что считается “своими” свойствами
Object.keys/values/entries возвращают только собственные перечисляемые свойства объекта. В обычных учебных объектах это ровно те поля, которые были добавлены напрямую.
const obj = { a: 1 };
Object.defineProperty(obj, "hidden", { value: 2, enumerable: false });
console.log(Object.keys(obj)); // ["a"]
Такой нюанс редко нужен на старте, но полезно понимать, почему некоторые свойства могут “не попадать” в список.
Частые ошибки
1) Пытаться вызвать keys на массиве как метод
Это статические методы Object, они вызываются так:
const obj = { a: 1 };
console.log(Object.keys(obj));
А не так:
const obj = { a: 1 };
console.log(obj.keys);
2) Использовать точку вместо скобок при переборе ключей
const user = { name: "Sam" };
const key = "name";
console.log(user.key); // undefined
console.log(user[key]); // "Sam"
Что стоит запомнить
Object.keysвозвращает массив ключей.Object.valuesвозвращает массив значений.Object.entriesвозвращает массив пар[key, value].- Эти методы упрощают перебор объекта через привычные инструменты массивов.
- При переборе по ключам обращение к значению делают через
obj[key].