Від автора: цикли while і do…while використовують рідше, ніж for, але вони набагато краще підходять в певних ситуаціях, що робить їх незамінними в JavaScript.
З циклу можна вийти за допомогою ключового слова break. Цикл for завжди пройде стільки повторів, скільки ви задали: якщо ви скажіть циклу for пройти n ітерацій, він це зробить. Інша справа цикли while і do…while. Ці цикли виконують стільки повторів, скільки буде потрібно для виконання умови.
Цикл do-while
Цикл do…while використовується в тому випадку, якщо потрібно виконати хоча б одну ітерацію, і ви не знаєте кількість повторень. Структура циклу:
do {
statements;
} while (condition);
Цикли do…while завжди виконуються хоча б один раз (на відміну від циклів while, які можуть зовсім не спрацювати). Іншими словами, цикл do…while завжди пройде одну ітерацію, а потім перевірить умова.
Хороший приклад – збільшення змінної з допомогою випадкового числа до певного максимуму. Цей метод я буду використовувати в моїй простий HTML5 грі в canvas.
Мені потрібно було розбити коло на сектори в грі, як на круговій діаграмі. Але я не хотів, щоб сектори були однакові: сектори повинні були бути в межах від мінімального до максимального кутів. Сектори в сумі повинні були складати 360 градусів. Іншими словами, я не дізнаюся, скільки разів потрібно запустити цикл, поки не запущу його. Але я знаю, що цикл запуститься хоча б раз, і це робить цикл do…while відмінним кандидатом в цьому прикладі. Спрощена версія коду гри:
var i = 1,
angle = 0,
minAngle = 12,
maxAngle = 40,
randomSectors = [0];
do {
angle = getRandom(minAngle,maxAngle) + randomSectors[i-1];
randomSectors.push(angle);
i++;
} while (angle < 360)
Змінної angle в циклі присвоюється випадкове значення в межах від 12 до 40 градусів, яке додається до значення, раніше переданим в масив randomSectors. По мірі виконання циклу змінна angle поступово повзе до значення 360, яке є умовою завершення циклу. Якщо умова істина, цикл завершує роботу. Так як angle випадкове число, я не знаю кількість згенерованих секторів. Однак я точно знаю, що буде хоча б один.
Зверніть увагу: так як умова в циклі do…while виконується після проходження ітерації, то кінцевий кут, який зберігається в останній групі масиву randomSectors, може перевищувати 360 градусів по закінченню роботи циклу. Дана проблема описується в повному коді гри.
Цикл while
У циклі while спершу завжди виконується умова. Тобто цикл може взагалі не виконатися або виконуватися нескінченно (потенційно таке може бути). Структура циклу:
while (condition) {
statements;
}
Хороший приклад – підкидання монети для прийняття рішення. Самі того не усвідомлюючи, ви будете підкидати монету, поки не випаде орел:
function coinFlip() {
return (Math.floor(Math.random() * 2) === 0);
}
var tossUp = coinFlip();
while (tossUp === false) {
console.log(“Not heads, darnit. Flipping again…”);
tossUp = coinFlip();
}
console.log(“Heads is true! Yay!”);
За кодом видно, що цикл while може взагалі не запуститися, так як змінна tossUp може відразу отримати значення true, тобто цикл буде не потрібен. Чисто теоретично цикл while може постійно говорити вам в консолі «Решка, спробуй ще…»: якщо початкове значення tossUp було false, а функція в циклі завжди повертає false. В такому випадку цикл ніколи не завершиться. На ділі ж напис «Решка» вискочить один або два рази, після чого цикл закриється з повідомленням «Орел – true».
Висновок
Як і в більшості випадків, трюк з циклами while і do…while полягає не просто в знанні, а в розумінні, де їх треба застосовувати. Цей навик можна отримати тільки, виконуючи багато прикладів. Є й інші цикли зі своїм застосуванням, про які я розповім в наступних статтях.
