Циклы - это конструкции которые выполняют многократно определенный блок кода. Если нам нужно много раз сделать однотипное действие, то привет циклы.

Цикл while и do while

while дословно передводится 'пока....(что то делается)'.
Пример:

let num = 50;

while (num <= 55 ) {   // пока num меньше или равно 55, мы будем выполнять код.
    // выполняться он будет вечно, так как у нас всегда num меньше 50, по этому используем инкремент
    console.log(num);
    num++;
}

do while - тот же цикл, только здесь do выполнится в любом случае как минимум один раз, даже если в условии будет false.
Пример :

let num = 50;
do {
    console.log('привет'); // выведет один раз привет, потом проверит условие, оно не выполнится и прервется, 
    // если условие будет true, то будет работать как обычный цикл while.
    numTwo++;
}

while(num >= 55 ); 

Цикл for

Цикл for - самый популярный, его можно более точно настроить, так как в нем может быть 3 аргумента.

1. То, с чего начинается цикл. Обычно это создание перменной, ну или добавляем туда нужную переменную.
2. Условие при котором цикл остановит свою работу. В нашем случае пока i меньше или равна 8 будет работать.
3. Шаг цикла - то что будет происходить в каждой итерации(последующее повторение) цилка, обычно это инкремент, просто увеличиваем i на единицу.

//      1        2      3
for (let i = 0; i <= 8; i++) {
 console.log(i) // выведет от 0 до 8
}

Операторы break и continue:
Эти операторы мы можем использовать в любом из циклов. br/eak прерывает работу цикла.

for (let i = 0; i <= 8; i++) {

    if (i === 6) { // пишем условие, что если i равна 6, то прерываем цикл!
        break; // прерывает цикл!! выведет с 1 до 5, так как на самой 6 произошел break и все прервалось!
    }
    console.log(i);
}

continue прерывает только определенную итерацию, далее цикл продолжает свою работу.

for (let i = 0; i <= 8; i++) {
    console.log(i) // выведет от 0 до 8

    if (i === 6) { // пишем условие, что если i равна 6, то прерываем цикл!!
        continue; // делает тоже что и br/eak, но не прерывается, когда он доходит до 6 он сбрасывает цикл, а потом продолжает его опять
        // здесь выведет с 1 до 8 пропустив 6(1.2.3.4.5.7.8) (пропускает нужный шаг, по сути)
    }
    console.log(i);
}

Цикл for of

Цикл for of перебирает значения. Используется в основном на массивах.

let arr = [1, 2, 3, 4, 5, 6, 7, 8];
for (let key of arr) {

    console.log(key); // выдаст наши значения от 1 до 8.
}

Цикл for in

Цикл for in перебирает свойства и значения. Используется на объектах

const obj = { // объект
    a: 1,
    b: 2,
    c: 3
};

for (let key in obj) {
    // Через [] скобки мы обращаемся к key, внутрь key складываются свойства
    // таким синтаксисам мы получаем именно значения этих свойств
    console.log(obj[key]); // выдаст нам значения 1,2,3. 
    // А для получениях самих свойств, просто указываем key
    console.log(key); // выдаст свойства a,b,c
}

Цикл for of на обычном объекте

Для того, что бы for of... перебирал объект, он должен быть итерируемый. Это массивы, строки, и тд. У всех этих конструкций в прототипах есть метод Symbol.iterator - что значит, что они итерируемы, мы можем выполнить на них итерацию. Для того, что бы сделать это с обычным объектом, нам нужно добавить в него этот метод самим:

let obj = {
    from: 10,
    to: 14
};

obj[Symbol.iterator] = function () { // создаем в нашем объекте метод Symbol.iterator. Symbol.iterator - это ключ, а функция в нем значение.
    return {    // for of первым делом вызовет именно эту функцию и будет работать, с тем, что она возвращает
        currnet: this.from,   // созаем свойства с котороми будет работать цикл. Это будут наши свойства из объекта, где this = obj
        last: this.to,

        next() { // next() будет вызываться на каждой итерации
            if (this.currnet <= this.last) { // пишем условие
                return {
                    done: false, 
                    value: this.currnet++ // мы прибавляем каждый раз по 1 в свойство currnet
                }
            } else {
                return {
                    done: true // если done true, то цикл завершается
                }
            }
        }
    }
}

for(let num of obj) { // Теперь мы можем применить цикл for of к объекту
    console.log(num); // получим 10 11 12 13 14 15. мы перебрали значения между двумя свойствами
}