Немного отступления, чтобы объяснить ваш вопрос:
В Javascript объекты (среди них и массивы) хранят свойства в парах ключ-значение . Это означает, что каждое назначенное значение имеет ключ (имя свойства) для доступа к нему. Например, в
person[name] = 'Tom'
person это объект, name ключ и 'Tom' соответствующее значение.
Массивы используют индексы (то есть числа) в качестве ключей:
array[5] = 10
Теперь учтите это в следующем объяснении.
Давайте начнем с традиционного для l oop:
for(let i = 0; i < array.length; i++) {...}
Этот способ перебора массива является самым старым из множества (если вы не используете циклы while). Вы найдете соответствующий способ написания для l oop практически на любом (императивном) языке программирования. Вы заметите, это очень явно в том, как это работает. Например, вы можете изменить условие прерывания i < array.length на что-то другое (например, i < array.length-1 для пропуска последней позиции) или шаг i++ (например, на i+=2), или начать с другой индекс (например, let i = 5). Вы можете выполнять итерацию в обратном направлении вместо массива, если хотите. Практически все, что вы можете сделать в другом для l oop, вы можете сделать и в этом роде, если знаете, как.
Внутри скобок {...} вы можете использовать i в качестве ключ для доступа к массивам значения
Теперь все это очень мощно и приятно, но писать каждый раз становится громоздким, особенно если в большинстве случаев вы просто хочу перебрать массив. Но, к счастью, у нас есть for-in:
For-in вернет вам все ключи , которые вы установили самостоятельно. С массивом вы можете использовать его для достижения того же результата, что и выше, используя
for(let i in array) {...}
Обратите внимание, что for-in не только даст вам цифровые ключи из массива. Он также будет работать с другими ключами, которые вы установили самостоятельно для любого объекта:
let object = {
key1 : 'value',
key2 : 'value'
}
for(let i in object) {
console.log(i)
}
выйдет из системы 'key1' и 'key2' (да, ключи здесь также являются строками).
Чтобы получить более точное описание того, какие именно ключи вам будут предоставлены, взгляните на ссылку ниже.
Когда бы вы использовали for-in? Всякий раз, когда вы хотите вызвать некоторый код для каждого элемента массива / (почти) каждого свойства объекта один раз. Например, когда вы хотите увеличить все значения в массиве на 1. Когда не использовать for-in? Не используйте его, если вам нужен более детальный контроль над порядком, в котором вы проходите массив, или вы не хотите поражать все элементы массива, а только каждую секунду / треть.
Для превосходного ресурс для циклов for-in Я рекомендую Mozilla Developer Network
Итак, что же такое циклы for-of?
Циклы for-of синтаксически (т. е. способ их написания) очень похож на циклы for-in:
for(let v of array) {...}
Однако, с одной стороны, они будут работать только с так называемыми повторяемыми объектами ( массивы повторяемы). Во-вторых, вы получаете только значения . Они больше не будут давать вам ключи!
let array = ['a', 'b', 'c']
for(let v of array) {
console.log(v)
}
logs 'a', 'b' и 'c'. Вы больше не будете знать, какие ключи имели эти значения!
Итак, когда их использовать? Каждый раз, когда вам просто нужны значения и не заботятся о ключах. Например, если вы просто хотите напечатать значения. Когда их не использовать? Если вы хотите поменять местами элементы массива, если вы хотите изменить порядок. Вы даже не можете увеличивать значения на 1 и сохранять их обратно в массив, потому что для этого вам нужно знать их соответствующий ключ.
Для получения дополнительной информации о циклах for-in, а также о том, что можно повторять. на самом деле означает, опять же, я рекомендую MDN