логотип PurpleSchool
логотип PurpleSchool

Цикл for...in в JavaScript

Автор

Дмитрий Нечаев

Цикл for...in в JavaScript предоставляет удобный способ перебора всех перечисляемых свойств объекта. Он позволяет обойти все имена свойств объекта и выполнить определенные действия с их значениями.

Синтаксис

for (variable in object) {
  // Тело цикла
}

Где variable - это переменная, в которую будут поочередно записываться имена свойств объекта object.

Примеры

Рассмотрим пример использования цикла for...in для перебора свойств объекта:

const person = {
  name: 'John',
  age: 30,
  city: 'New York'
};

for (let key in person) {
  console.log(key + ': ' + person[key]);
}

В этом примере цикл for...in перебирает все свойства объекта person, записывая имя свойства в переменную key, а затем использует это имя для получения значения свойства и вывода его в консоль. Результат будет следующим:

name: John
age: 30
city: New York

Использование проверки на собственные свойства

При использовании цикла for...in следует учитывать, что он перебирает все перечисляемые свойства, включая свойства, унаследованные из прототипа объекта. Поэтому иногда полезно проверять, является ли свойство собственным (не унаследованным).

for (let key in person) {
  if (person.hasOwnProperty(key)) {
    console.log(key + ': ' + person[key]);
  }
}

Метод hasOwnProperty() используется для проверки того, является ли свойство собственным свойством объекта, и исключает унаследованные свойства.

Заключение

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

Стрелочка влевоЦикл for...of в JavaScriptОбъект Date в JavaScriptСтрелочка вправо

Все гайды по Javascript

Как работает метод trim() - JavaScriptКак работает метод toUpperCase() - JavaScriptКак работает метод toLowerCase() - JavaScriptКак работает метод substring() - JavaScriptКак работает метод startsWith() - JavaScriptКак работает метод split() - JavaScriptКак работает метод slice() - JavaScriptКак работает метод search() - JavaScriptКак работает метод replaceAll() - JavaScriptКак работает метод replace() - JavaScriptКак работает метод repeat() - JavaScriptКак работает метод padStart() - JavaScriptКак работает метод padEnd() - JavaScriptКак работает метод matchAll() - JavaScriptКак работает метод match() - JavaScriptКак работает метод localeCompare() - JavaScriptКак работает свойство length - JavaScriptКак работает метод lastIndexOf() - JavaScriptКак работает метод indexOf() - JavaScriptКак работает метод includes() - JavaScriptКак работает метод fromCodePoint() - JavaScriptКак работает метод fromCharCode() - JavaScriptКак работает метод endsWith() - JavaScriptКак работает метод concat() - JavaScriptКак работает метод codePointAt() - JavaScriptКак работает метод charCodeAt() - JavaScriptКак работает метод charAt() - JavaScript
Итератор в JavaScript
Error в JavaScripttry...catch в JavaScript
Событие wheel в JavaScriptСобытие unload в JavaScriptСобытие touch в JavaScriptСобытие submit в JavaScriptСобытие scroll в JavaScriptСобытие reset в JavaScriptМетод .preventDefault() в JavaScriptСобытие mouseover в JavaScriptСобытие mouseout в JavaScriptСобытие load в JavaScriptСобытие keyup в JavaScriptСобытие keydown в JavaScriptСобытие invalid в JavaScriptСобытие input в JavaScriptСобытийная модель Event в JavaScriptОбъект события Event в JavaScriptСобытие DOMContentLoaded в JavaScriptСобытие dblclick в JavaScriptСобытие click в JavaScriptСобытие change в JavaScriptСобытие beforeunload в JavaScript
Как работает метод some() - JavaScriptКак работает метод reverse() - JavaScriptКак работает метод reduce() - JavaScriptКак работает метод map() - JavaScriptКак работает метод isArray() - JavaScriptКак работает метод indexOf() - JavaScriptКак работает метод includes() - JavaScriptКак работает метод from() - JavaScriptКак работает метод forEach() - JavaScriptКак работает метод flatMap() - JavaScriptКак работает метод flat() - JavaScriptКак работает метод findIndex() - JavaScriptКак работает метод find() - JavaScriptКак работает метод filter() - JavaScriptКак работает метод every() - JavaScriptМассивы в JavaScript
Открыть базу знаний