Цикл в вычислениях — это инструкция, которая итерирует, повторяет или выполняет одно или несколько операторов снова и снова.

Некоторые циклы выполняют оператор до тех пор, пока заданное условие истинно, в то время как другие выполняют оператор до определенного числа раз.

Я уверен, что в вашем музыкальном плеере есть функция цикла, где вы можете выбрать конкретную песню для повторения снова и снова. Это означает, что цикл в основном что-то повторяет!

Сегодня я расскажу о том, как зациклиться на объекте. Но прежде чем мы продолжим, я хотел бы, чтобы вы поняли, что такое объекты и как их создать.

Повторение предметов

Что такое объект?

Объект — это особый тип массива, который хранит данные в виде пары {ключ-значение}. Одна пара этих данных называется свойством этого объекта.

Ниже приведены некоторые способы создания объекта в JavaScript.

  • Использование синтаксиса литерала объекта {
  • Использование функции-конструктора
  • Использование фабричной функции

Освежив вашу память, я покажу вам различные подходы к циклическому обходу объекта.

Прежде чем мы перейдем к любому из подходов, я хотел бы, чтобы вы поняли эти два метода Object.

  • Object.keys()

Этот метод помогает получить все ключи, принадлежащие объекту, как Array

  • Object.values()

Этот метод помогает получить все значения, принадлежащие объекту, как Array

Зная описанные выше методы объекта, мы можем написать цикл, который будет проходить через объект.

ПОДХОД 1 (использование числа в качестве индекса)

Теперь помните, что свойство объекта — это просто комбинация ключа и значения, т. е. { key : value }. Таким образом, используя метод Object.keys(), мы можем получить все ключи, принадлежащие объекту, перебрать ключи с помощью while-loop, а затем, используя конкретный ключ в качестве числового индекса, мы получим присвоенное ему значение.

В приведенном выше коде объект имеет 3 свойства, и для того, чтобы перебрать ключи объекта, мы должны:

  • Запрос длины ключей
  • Получите доступ ко всем ключам объекта и проверьте ключ, присутствующий в указанном index.
  • Получите доступ ко всем значениям объекта и проверьте значение, присутствующее в указанном index.

ПОДХОД 2 (использование ключа в качестве указателя)

Напомним, что использование метода Object.keys() извлекает ключи объекта в виде Array.

В этом подходе мы будем использовать цикл for-each для циклического перебора ключей объекта, которые возвращаются в виде массива, а затем, используя конкретный ключ в качестве элемента под рукой, мы можем получить доступ к присвоенному ему значению.

ПОДХОД 3 (Использование цикла for..in)

Учитывая второй подход, описанный выше, мы можем добиться тех же результатов, используя класс for ...in loop.

В этом подходе нам нужно определить синтаксис цикла для доступа к каждому ключу, присутствующему в объекте. Затем при доступе к каждому ключу извлеките связанное значение.

Этот подход, безусловно, самый простой способ зациклиться на объекте.

Надеюсь, вы поняли три подхода, которые можно использовать для циклического обхода объекта в JavaScript.

Вы дошли до конца моей статьи.

ДОПОЛНИТЕЛЬНЫЙ

Недавно я запустил пакет JavaScript, который проверяет ваши HTML-формы с помощью правил проверки, регулярных выражений и входных атрибутов формы.

Я буду признателен, если вы уделите несколько секунд, чтобы проверить это.

octavalidate on product hunt

Спасибо