Javascript 简明教程
JavaScript - While Loops
JavaScript 中的 while 语句创建一个循环，该循环会重复执行一段代码块，只要指定条件为 true 。在执行代码块之前，会对条件进行评估。
A while statement in JavaScript creates a loop that executes a block of code repeatedly, as long as the specified condition is true. The condition is evaluated before the execution of the block of code.
在编写程序时，您可能会遇到需要一遍又一遍地执行某个操作的情况。在这种情况下，您需要编写循环语句，以减少代码行数。
While writing a program, you may encounter a situation where you need to perform an action over and over again. In such situations, you would need to write loop statements to reduce the number of lines.
JavaScript 支持所有必要的循环，以减轻编程压力。在本教程中，我们将讨论 while 循环。
JavaScript supports all the necessary loops to ease the pressure of programming. In this chapter, we will discuss the while loop.
JavaScript 中有 2 种 while 循环，如下所示：
There are 2 kinds of while loops in JavaScript, as given below.
-
Entry-controlled loops − The loop checks whether the looping condition is valid first and enters into the body of the loop to execute the loop statements.
-
Exit-controlled loops − The loop enters into the body and executes the loop statements without checking the condition. After completing the iteration, it checks the condition.
JavaScript while Loop
JavaScript 中最基本的循环是 while 循环，本教程将对此进行讨论。while 循环是入口受控循环。
The most basic loop in JavaScript is the while loop which would be discussed in this chapter. The while loop is an entry-controlled loop.
while 循环的目的是在 expression 为 true 的情况下重复执行语句或代码块。一旦表达式变为 false, ，循环将终止。
The purpose of a while loop is to execute a statement or code block repeatedly as long as an expression is true. Once the expression becomes false, the loop terminates.
Syntax
while loop 在 JavaScript 中的语法如下所示 −
The syntax of while loop in JavaScript is as follows −
while (expression) {
Statement(s) to be executed if expression is true
}Example
在下面的示例中，我们定义了变量“count”，并将其初始化为 0。之后，我们使用 while 循环进行迭代，直到 count 的值小于 10。
In the example below, we defined the 'count' variable and initialized it with 0. After that, we make iterations using the while loop until the value of the count is less than 10.
<html>
<body>
<div id = 'output'></div>
<script type="text/javascript">
let output = document.getElementById("output");
var count = 0;
output.innerHTML="Starting Loop <br>";
while (count < 10) {
output.innerHTML+="Current Count : " + count + "<br>";
count++;
}
output.innerHTML+="Loop stopped!";
</script>
<p> Set the variable to a different value and then try... </p>
</body>
</html>JavaScript do…while Loop
do…while 循环与 while 循环类似，区别在于条件检查发生在循环结尾。这意味着循环将始终至少执行一次，即使条件为 false 。
The do…while loop is similar to the while loop except that the condition check happens at the end of the loop. This means that the loop will always be executed at least once, even if the condition is false.
Syntax
JavaScript 中 do-while 循环的语法如下 −
The syntax for do-while loop in JavaScript is as follows −
do {
Statement(s) to be executed;
} while (expression);Example
在下面的示例中，我们使用了 do…while 循环，并一直打印输出中的结果，直到 count 变量的值小于 5。在输出中，我们可以观察到它总是执行一次，即使条件为 false。
In the example below, we used the do…while loop and printed the results in the output until the value of the count variable is less than 5. In the output, we can observe that it always executes for once, even if the condition is false.
<html>
<body>
<div id="output"></div>
<script type="text/javascript">
let output = document.getElementById("output");
var count = 0;
output.innerHTML += "Starting Loop" + "<br />";
do {
output.innerHTML += "Current Count : " + count + "<br />";
count++;
}
while (count < 5);
output.innerHTML += "Loop stopped!";
</script>
<p>Set the variable to a different value and then try...</p>
</body>
</html>JavaScript while vs. for Loops
JavaScript while 循环与 for 循环类似，但省略了第一个和第三个表达式。当迭代次数是固定的并且已知时，通常使用 for 循环，但当迭代次数未知时，我们使用 while 循环。
The JavaScript while loop is similar to the for loop with the first and third expressions omitted. A for loop is generally used when the number of iteration is fixed and known but we use the while loop whne the number of iterations is not known.
Example
让我们举一个使用 for 循环打印前五个自然数的示例 −
Let’s take an example of printing the first five natural numbers using for loop −
<html>
<body>
<p> First five natural numbers:</p>
<div id = "demo"> </div>
<script>
const output = document.getElementById("demo");
for(let i = 1; i <= 5; i++){
output.innerHTML += i + "<br>";
}
</script>
</body>
</html>它将生成如下输出：
It will produce the following output −
First five natural numbers:
1
2
3
4
5Example
我们现在可以如下修改上述 for 循环 −
We can now modify the above for loop as follows −
<html>
<body>
<p> First five natural numbers:</p>
<div id = "demo"> </div>
<script>
const output = document.getElementById("demo");
let i = 1;
for(; i <= 5; ){
output.innerHTML += i + "<br>";
i++
}
</script>
</body>
</html>输出
Output
First five natural numbers:
1
2
3
4
5Example
在上述示例中，我们在 for 循环语句中省略了第一个和第三个表达式。这类似于 while 循环语句。请看下面的示例 −
In the above example, we have omitted first and third expression in for loop statement. This is similar to the while loop statement. Look at the below example −
<html>
<body>
<p> First five natural numbers:</p>
<div id = "demo"> </div>
<script>
const output = document.getElementById("demo");
let i = 1;
while(i <= 5){
output.innerHTML += i + "<br>";
i++
}
</script>
</body>
</html>输出
Output
First five natural numbers:
1
2
3
4
5您会注意到，没有第一个表达式（初始化）和第三个表达式（迭代）的 for 循环类似于 while 循环。
You notice that the for loop without first expression (initialization) and third expression (iteration), is similar to the while loop.