JavaScript во время цикла

Оглавление

    Показать оглавление

Циклы могут выполнять блок кода пока заданное условие истинно.

Цикл while

Цикл while проходит по блоку кода, пока заданное условие истинно.

Синтаксис

while (condition) {
      // code block to be executed
 }

Пример

В следующем примере код в цикле будет выполняться снова и снова, пока переменная (i) меньше 10:

Пример

while (i < 10) {
    text += "The number is " + i;
    i++;
}

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript While Loop</h2>

<p id="demo"></p>

<script>
let text = "";
let i = 0;
while (i < 10) {
  text += "<br>The number is " + i;
  i++;
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Если вы забудете увеличить переменную, используемую в условии, цикл никогда не завершится. Это приведет к сбою вашего браузера.

Цикл do while

Цикл do while — это вариант цикла while. Этот цикл будет выполнить блок кода один раз, прежде чем проверять, истинно ли условие, тогда он будет повторяйте цикл до тех пор, пока условие истинно.

Синтаксис

do {
      // code block to be executed
}
while (condition);

Пример

В приведенном ниже примере используется цикл do while. Цикл всегда будет выполняется хотя бы один раз, даже если условие ложно, поскольку блок кода выполняется до проверки условия:

Пример

do {
    text += "The number is " + i;
    i++;
 }
while (i < 10);

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Do While Loop</h2>

<p id="demo"></p>

<script>
let text = ""
let i = 0;

do {
  text += "<br>The number is " + i;
  i++;
}
while (i < 10);  

document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Не забудьте увеличить переменную, используемую в условии, иначе цикл никогда не закончится!

Сравнение for и while

Если вы прочитали предыдущую главу о цикле for, вы обнаружите, что цикл while во многом аналогично циклу for, только оператор 1 и оператор 3 опущены.

Цикл в этом примере использует цикл for для сбора автомобиля. имена из массива cars:

Пример

const cars = ["BMW", "Volvo", "Saab", "Ford"];
let i = 0;
let text = "";

for (;cars[i];) {
    text += cars[i];
   
i++;
}

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
const cars = ["BMW", "Volvo", "Saab", "Ford"];

let i = 0;
let text = "";
for (;cars[i];) {
  text += cars[i] + "<br>";
  i++;
}

document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Цикл в этом примере использует цикл while для сбора данных. имена машин из массива cars:

Пример

const cars = ["BMW", "Volvo", "Saab", "Ford"];
let i = 0;
let text = "";
 
 while (cars[i]) {
    text += cars[i];
   
i++;
}

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
const cars = ["BMW", "Volvo", "Saab", "Ford"];

let i = 0;
let text = "";
while (cars[i]) {
  text += cars[i] + "<br>";
  i++;
}

document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>