Перебор массива

Циклы и массивы неразлучны. С помощью цикла for можно пройти по индексам массива от 0 до последнего и прочитать каждый элемент:

const games = ["Футбол", "Теннис", "Гольф"];
for (let i = 0; i < games.length; i++) {
    console.log(games[i]);
}

Вывод:

Футбол
Теннис
Гольф

Счётчик i начинается с 0 — первого индекса. Условие i < games.length завершает цикл после последнего индекса, то есть games.length - 1. Частая ошибка — i <= games.length: тогда цикл выполнится ещё раз, прочитает несуществующий games[3] и выведет undefined. Благодаря .length цикл работает для массива любой длины, даже если вы потом добавите в него элементы через .push().

Пройти по всем элементам нужно так часто, что в JavaScript для этого есть более простой цикл — for...of:

const games = ["Футбол", "Теннис", "Гольф"];
for (const game of games) {
    console.log(game);
}

Футбол
Теннис
Гольф

Читайте его как «для каждой game из games». В каждой итерации переменная game хранит следующий элемент: сначала "Футбол", потом "Теннис", затем "Гольф". Ни индекс, ни .length здесь вообще не нужны. Называйте переменную по одному элементу массива: game из games, name из names.

Почему game может быть const, а счётчик обычного цикла for обязан быть let? Потому что for...of создаёт новую переменную game для каждой итерации, и в течение итерации её ничто не меняет. А счётчик i — это одна переменная, которую i++ постоянно меняет.

Так что же выбрать? for...of — когда нужен каждый элемент по очереди. Он короче, и в индексах не запутаться. Обычный for — когда нужен ещё и индекс, например чтобы пронумеровать элементы, или когда нужно идти в обратную сторону или пропускать часть элементов.