【Web前端基础知识】JavaScript中while的常见问题

我们先看几个关于while循环语句的简单问题。

问题一：

请用while求出1到100的和，并在控制台中打印出来。

我们很小的时候就听过数学家高斯计算1到100的和的故事，他可以很快的计算出1到100的和。高斯是这样算的：1+100=101，2+99=101······50+51=101。从1加到100有50组这样的数，所以50X101=5050

问题二：

让用户输入用户名和密码，如果正确，提示“用户名和密码正确”，程序结束。如果错误，就一直输入。

(正确的用户名是：ujiuye，密码是：666666)

问题三：

计算1到100相加的和，但是，如果这个数的个位数是9，那就不要把这个数加进去。

我们可以看出，上面这几个问题都分别重复做着一件事儿，就需要我们运行多次代码，假如您需要运行代码多次，且每次使用不同的值，因此，我们使用循环语句的话就很方便了。

循环语句是JavaScript中一类允许执行重复动作的语句，同条件语句一样，循环语句也是JavaScript的基本控制语句，在JavaScript中循环语句主要有：while循环和for循环两种形式，这几个问题中我们都使用while来解决。

下面我们来依次分析下：

Ø 问题一用到了while循环

while循环

while 循环会一直循环代码块，只要指定的条件为 true。

语法：

1. while (条件) { 
2.     要执行的代码块 
3. } 

while循环的执行流程：

当代码执行到while的时候，会先判断判断条件是否为true，如果为true，那么会执行while大括号中的代码块，代码块执行完毕以后，再次回到while中再进行判断，如果为true,再次执行while大括号中的代码块，并且再次回while，如果为false就不执行大括号中的代码块。

例如：

请用while求出1到100的和，并在控制台中打印出来。

1. var i = 1; 
2. var sum = 0; 
3. while (i <= 100) { 
4.    sum += i; 
5.    i++; 
6. } 
7. console.log(sum); 

上面代码运行的步骤：

执行var i= 1; var sum = 0;这两条语句，所以i的值是1，sum的值是0。

然后程序会验证下 i<=100 是否满足，1<=100是真，所以执行一次循环体。

执行完循环体之后，sum的值是1，i的值是2。

然后程序会验证下 i<=100 是否满足，2<=100是真，所以执行一次循环体。

执行完循环体之后，sum的值是3，i的值是3。

然后程序会验证下 i<=100 是否满足，3<=100是真，所以执行一次循环体。

执行完循环体之后，sum的值是6，i的值是4。

然后程序会验证下 i<=100 是否满足，4<=100是真，所以执行一次循环体。

执行完循环体之后，sum的值是10，i的值是5。

然后以此类推。。。

直到i的值是101的时候，程序会验证下 i<=100 是否满足，101<=100是假，所以不执行循环体，程序跳出循环。

Ø 问题二用到了break语句

break 语句

作用：“跳出”循环。

break 语句会中断循环，并继续执行循环之后的代码。

例如：

让用户输入用户名和密码，如果正确，提示“用户名和密码正确”，程序结束。如果错误，就一直输入。

(正确的用户名是：ujiuye，密码是：666666)

我们使用上面刚提到的while循环和break解答。

1. var name = prompt("请输入用户名"); 
2. var password = prompt("请输入密码"); 
3. while(true){ 
4.    if(name == "ujiuye" && password == "666666"){ 
5.         alert('用户名和密码正确'); 
6.         break; 
7.     }else{ 
8.         name = prompt("请输入用户名"); 
9.         password = prompt("请输入密码"); 
10.     } 
11. } 

这里面的break就是跳出循环语句的。

Ø 问题三用到了continue语句

continue 语句

作用：“跳过”循环中的一个迭代。

continue 语句中断(循环中)的一个迭代，如果发生指定的条件。然后继续循环中的下一个迭代。

例如：

计算1到100相加的和，但是，如果这个数的个位数是9，那就不要把这个数加进去。

我们用上面提到的while和continue语句完成。

1. var i = 1; 
2. var sum = 0; 
3. while(i<=100){ 
4.    if(i % 10 == 9){ 
5.         i++; 
6.         continue; 
7.     } 
8.         sum += i; 
9.         i++; 
10. } 
11. console.log(sum); 

判断下这个数的个位数是不是9，如果i%10==9，那么这个数的个位数就是9，就不需要把这个数加进入了，使用continue来结束本次循环，然后继续循环中的下一个迭代。