Перебор объектов в JavaScript: что это и зачем нужно

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

Перебор объекта в JS (JavaScript) выполняется при помощи цикла «for...in». Этот цикл отлично «отрабатывает», однако имеет один недостаток. Каждое найденное свойство потом необходимо проверять на принадлежность свойству объекта. Такая операция делается при помощи метода «hasOwnProperty». Однако с внедрением новшеств в JavaScript появились новые методы, чтобы осуществить перебор объекта.

Перебор объекта в JS

Перебор объекта по новому методу также осуществляется при помощи цикла «for...in». Однако перед его применением нужно преобразовать объект в массив.

Объект преобразуется в массив одним из трех методов:

1. «Object.keys». Этот метод преобразует объект в массив, который будет содержать в себе только ключевые свойства объекта.

2. «Object.values». Этот метод преобразует объект в массив, который будет содержать все свойства объекта.

3. «Object.entries». Этот метод преобразует объект в «массив из массивов». Вложенный массив будет содержать 2 компонента: ключевое свойство объекта и его значение.

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

После преобразования объекта в массив по массиву можно пройтись привычным циклом — в этом нет ничего сложного. Как выглядит само преобразование — смотрите чуть ниже.

Object.keys:

const myFruits = {

  banana: 29,

  grapefruit: 18,

  prune: 55,

}

 

const keys = Object.keys(myFruits)

console.log(keys)  // Результат будет [banana, grapefruit, prune]

 

Object.values:

const myFruits = {

  banana: 29,

  grapefruit: 18,

  prune: 55,

}

 

const values = Object.values(myFruits)

console.log(values)  // Результат будет [29, 18, 55]

 

Object.entries:

const myFruits = {

  banana: 29,

  grapefruit: 18,

  prune: 55,

}

 

const entries = Object.entries(myFruits)

console.log(entries)

//  Результат будет[ [banana, 29], [grapefruit, 18], [prune, 55] ]

 

Заключение

Самый удобный способ осуществить перебор объекта в JS — это преобразовать объект в массив одним из приведенных выше способов. А потом нужно будет пройтись по массиву любимым циклом, в общем, работать как с обычным массивом.