JavaScript

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

Lorem ipsum dolor

Перебор объекта в 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 — это преобразовать объект в массив одним из приведенных выше способов. А потом нужно будет пройтись по массиву любимым циклом, в общем, работать как с обычным массивом.

Схожие статьи

Node JS: плюсы и минусы популярной среды запуска JavaScript-приложений
JavaScript

Node JS: плюсы и минусы популярной среды запуска JavaScript-приложений

Учебный курс по React, часть 2: функциональные компоненты
JavaScript

Учебный курс по React, часть 2: функциональные компоненты

Учебный курс по React, часть 5: начало работы над TODO-приложением, основы стилизации
JavaScript

Учебный курс по React, часть 5: начало работы над TODO-приложением, основы стилизации

Многопоточность Java: определение, пулы, функции и особенности
JavaScript

Многопоточность Java: определение, пулы, функции и особенности