Обложка канала

Дизайнер учит код

Канал о том, как дизайнер интерфейсов осваивает код, чтобы научиться создавать интерактивные прототипы.

Дизайнер учит код

9 лет назад
Открыть в
Пришла пора циклов! Циклы — это такая штука, которая повторяет код до тех пор, пока какое-либо условие даёт true.

while — самый простой вид циклов. while используют, если есть какое-то определённое условие. Пример:

var numbers = 0;
while (numbers < 5) {
console.log(numbers + "!");
numbers++;
}
console.log("Расчёт окончен!");
//result Посчитает от 0 до 4 и напишет «Расчёт окончен!»

numbers++ — это приращение (увеличивает значение на 1). Если убрать эту строку, то цикл станет бесконечным, а результат всегда будет 0.

for — чуть сложнее. Этот вид цикла чаще всего используют для работы с массивами. Пример предыдущего цикла, написанного через for:

for (var numbers = 0; numbers < 5; numbers++) {
console.log(numbers + "!");
}
console.log("Расчёт окончен!");
//result Посчитает от 0 до 4 и напишет «Расчёт окончен!»

Цикл for, который перебирает массив:

var iLike = ["пёсика", "котика", "пожрать"];
for (var i = 0; i < iLike.length; i++) {
console.log("Я люблю " + iLike[i] + ".");
}
//result Я люблю пёсика. Я люблю котика. Я люблю пожрать.

Мой товарищ Костя Вульсонов советует этот цикл переписать так:

var iLike = ["пёсика", "котика", "пожрать"];
for (var i = 0, max = iLike.length; i < max; i++) {
console.log("Я люблю " + iLike[i] + ".");
}
//result Я люблю пёсика. Я люблю котика. Я люблю пожрать.

В варианте Кости длина массива единожды передаётся в переменную max, а не считается каждый раз при новой итерации, как в варианте выше. Следовательно, код будет работать быстрее. Конечно, при таком маленьком массиве разница не будет заметна, но если можно сделать лучше — надо делать.

Это далеко не все виды циклов. Я разобрал только самые простые. По мере необходимости буду узнавать новые.