Каква е разликата между цикли for...in и for...of?

Цикълът for...in обхожда ключовете (свойствата) на изброимите свойства на обекта, включително свойствата в прототипната му верига.

Цикълът for...of обхожда стойностите на итерабелните обекти (Array, Map, Set, String, arguments и др.). Той не обхожда свойствата на прототипа.

	for...in	for...of
Обхожда	Ключовете (свойствата) на обекта	Стойностите на итерабелните обекти
Използва се с	Обекти	Масиви, низове, Map, Set и други итерабелни обекти
Прототип	Обхожда свойствата на прототипа	Не обхожда свойствата на прототипа
Ред на обхождане	Не е гарантирано за нецелочислени ключове	Гарантирано за масиви (по индекс)

Пример for...in:

const obj = { a: 1, b: 2 };
for (const key in obj) {
  console.log(key, obj[key]); // Ще изведе: "a 1", "b 2"
}

Пример for...of:

const arr = [1, 2, 3];
for (const value of arr) {
  console.log(value); // Ще изведе: 1, 2, 3
}

Обикновено, за обхождане на масиви и подобни структури, е по-добре да се използва for...of, а за обхождане на свойствата на обекти — for...in (често в комбинация с hasOwnProperty, за да се изключат свойствата на прототипа).