Перейти до основного вмісту
Модуль 5 · Урок 2 із 418/32 у курсі~10 min
Модульні уроки (2/4)

для…з і для…в

У JavaScript є два «ергономічні» цикли, які не слід плутати:

  • for…of повторює значення ітерованої колекції (масив, рядок, набір, карта...).
  • for…in повторює перелічувані ключі об’єкта.

Вони є близькими двоюрідними братами, і їх легко поміняти — використання неправильної мови є одним із перших у цій мові пастки.

for…of для масивів і рядків

JS
const colori = ['rosso', 'verde', 'blu'];
for (const c of colori) {
  console.log(c); // 'rosso', 'verde', 'blu'
}

for (const ch of 'abc') {
  console.log(ch); // 'a', 'b', 'c'
}

Це не дає вам індекс. Якщо вам також потрібен індекс, використовуйте entries():

Code
for (const [i, c] of colori.entries()) {
  console.log(i, c); // 0 rosso, 1 verde, 2 blu
}

for…in для об’єктів

JS
const utente = { nome: 'Anna', eta: 30, citta: 'Roma' };
for (const chiave in utente) {
  console.log(chiave, utente[chiave]); // 'nome' 'Anna', ...
}

Коли їх НЕ плутати

JS
const colori = ['rosso', 'verde', 'blu'];

// SBAGLIATO: stampa gli indici come stringhe!
for (const x in colori) {
  console.log(x); // '0', '1', '2'
}

// GIUSTO
for (const x of colori) {
  console.log(x); // 'rosso', 'verde', 'blu'
}

Спробуйте

вправи#js.m5.l2.e1
Спроби: 0Завантаження…

Визначте `concat(words)`, який, отримавши список рядків, повертає рядок з усіма ними об’єднаними, розділеними пробілом. Використовувати для...з.

Завантаження редактора…
Показати підказку

Накопичувати в рядок; додайте пробіл, лише якщо це не перше слово.

Рішення доступне після 3 спроб

Повторна вправа

вправи#js.m5.l2.e2
Спроби: 0Завантаження…

Визначте `positiveValues(obj)`, який повертає масив зі значеннями об’єкта, які є числами > 0. Використовуйте for…in. Порядок має відповідати порядку повторення ключів.

Завантаження редактора…
Показати підказку

Цикл з for...in над клавішами, фільтр із typeof і > 0, надсилання результатів.

Рішення доступне після 3 спроб