Перебір обєкта JSON за допомогою циклу for in..

Від автора: у звичайних масивах можна використовувати цикл for. Об’єкти JSON ж відрізняються від звичайних масивів тим, що кожна клітинка містить у собі пару властивість Ñ– значення. Щоб отримати ці складові масиву Ñ– звертатися до них окремо найчастіше потрібен інший підхід. Цикл for..in – один з таких підходів.

Хорошим прикладом послужить створений мною в попередній статті об’єкт CSS квітів. JSON масив починається так:

var cssColors = { «aliceblue»: «#f0f8ff», «antiquewhite»: «#faebd7», «aqua»: «#00ffff», «aquamarine»: «#7fffd4», «azure»: «#f0ffff», … }

Щоб створити діаграму CSS квітів для тієї статті, мені потрібно було пройти в циклі по об’єкту: іншими словами, отримати перераховані властивості масиву. Це легко можна зробити за допомогою варіації циклу for з частинкою in:

for (var key in cssColors) { … }

Змінну key можна назвати як завгодно (будь-яке підходяще слово), в ній буде зберігатися властивість. Для виведення результату в консоль для тесту можна змінити скрипт:

for (var key in cssColors) { console.log(key) }

Ви отримаєте наступне:

aliceblue antiquewhite aqua aquamarine azure …

Якщо ви хочете додати значення властивості висновок, можна додати кому та об’єкт з ключем:

for (var key in cssColors) { console.log(key, cssColors[key]) }

Результат:

aliceblue #f0f8ff antiquewhite #faebd7 aqua #00ffff aquamarine #7fffd4 azure #f0ffff

На цій основі можна створити майже будь-яку конструкцію: подивіться приклад демо з іменованими CSS квітами на CodePen.

Неправильне використання та можливі обмеження

Особливість циклу for..in в тому, що він може перераховувати успадковані властивості, а не тільки Ñ‚Ñ–, які ви очікуєте побачити в об’єкті. Захиститися від цього можна з допомогою тесту hasOwnProperty:

for (var key in cssColors) { if (cssColors.hasOwnProperty(key)) { … do something … } }

Дана умова перевіряє, присвоєно властивість безпосередньо об’єкту, Ñ– виводить його, якщо воно рідне. У циклу for..in можуть виникнути проблеми з масивами з порожніми слотами. Загальне правило – не варто додавати, видаляти або змінювати властивості в масиві під час його перебору.

JSON масив складається з безлічі об’єктів, Ñ– розглядати його потрібно трохи по-іншому. Більш детально про JSON масивах я розповім в наступній статті.