【W(wǎng)eb前端基礎(chǔ)知識】JavaScript中while的常見問題

我們先看幾個關(guān)于while循環(huán)語句的簡單問題。

問題一：

請用while求出1到100的和，并在控制臺中打印出來。

我們很小的時候就聽過數(shù)學家高斯計算1到100的和的故事，他可以很快的計算出1到100的和。高斯是這樣算的：1+100=101，2+99=101······50+51=101。從1加到100有50組這樣的數(shù)，所以50X101=5050

問題二：

讓用戶輸入用戶名和密碼，如果正確，提示“用戶名和密碼正確”，程序結(jié)束。如果錯誤，就一直輸入。

(正確的用戶名是：ujiuye，密碼是：666666)

問題三：

計算1到100相加的和，但是，如果這個數(shù)的個位數(shù)是9，那就不要把這個數(shù)加進去。

我們可以看出，上面這幾個問題都分別重復做著一件事兒，就需要我們運行多次代碼，假如您需要運行代碼多次，且每次使用不同的值，因此，我們使用循環(huán)語句的話就很方便了。

循環(huán)語句是JavaScript中一類允許執(zhí)行重復動作的語句，同條件語句一樣，循環(huán)語句也是JavaScript的基本控制語句，在JavaScript中循環(huán)語句主要有：while循環(huán)和for循環(huán)兩種形式，這幾個問題中我們都使用while來解決。

下面我們來依次分析下：

Ø 問題一用到了while循環(huán)

while循環(huán)

while 循環(huán)會一直循環(huán)代碼塊，只要指定的條件為 true。

語法：

1. while (條件) { 
2.     要執(zhí)行的代碼塊 
3. } 

while循環(huán)的執(zhí)行流程：

當代碼執(zhí)行到while的時候，會先判斷判斷條件是否為true，如果為true，那么會執(zhí)行while大括號中的代碼塊，代碼塊執(zhí)行完畢以后，再次回到while中再進行判斷，如果為true,再次執(zhí)行while大括號中的代碼塊，并且再次回while，如果為false就不執(zhí)行大括號中的代碼塊。

例如：

請用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); 

上面代碼運行的步驟：

執(zhí)行var i= 1; var sum = 0;這兩條語句，所以i的值是1，sum的值是0。

然后程序會驗證下 i<=100 是否滿足，1<=100是真，所以執(zhí)行一次循環(huán)體。

執(zhí)行完循環(huán)體之后，sum的值是1，i的值是2。

然后程序會驗證下 i<=100 是否滿足，2<=100是真，所以執(zhí)行一次循環(huán)體。

執(zhí)行完循環(huán)體之后，sum的值是3，i的值是3。

然后程序會驗證下 i<=100 是否滿足，3<=100是真，所以執(zhí)行一次循環(huán)體。

執(zhí)行完循環(huán)體之后，sum的值是6，i的值是4。

然后程序會驗證下 i<=100 是否滿足，4<=100是真，所以執(zhí)行一次循環(huán)體。

執(zhí)行完循環(huán)體之后，sum的值是10，i的值是5。

然后以此類推。。。

直到i的值是101的時候，程序會驗證下 i<=100 是否滿足，101<=100是假，所以不執(zhí)行循環(huán)體，程序跳出循環(huán)。

Ø 問題二用到了break語句

break 語句

作用：“跳出”循環(huán)。

break 語句會中斷循環(huán)，并繼續(xù)執(zhí)行循環(huán)之后的代碼。

例如：

讓用戶輸入用戶名和密碼，如果正確，提示“用戶名和密碼正確”，程序結(jié)束。如果錯誤，就一直輸入。

(正確的用戶名是：ujiuye，密碼是：666666)

我們使用上面剛提到的while循環(huán)和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就是跳出循環(huán)語句的。

Ø 問題三用到了continue語句

continue 語句

作用：“跳過”循環(huán)中的一個迭代。

continue 語句中斷(循環(huán)中)的一個迭代，如果發(fā)生指定的條件。然后繼續(xù)循環(huán)中的下一個迭代。

例如：

計算1到100相加的和，但是，如果這個數(shù)的個位數(shù)是9，那就不要把這個數(shù)加進去。

我們用上面提到的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); 

判斷下這個數(shù)的個位數(shù)是不是9，如果i%10==9，那么這個數(shù)的個位數(shù)就是9，就不需要把這個數(shù)加進入了，使用continue來結(jié)束本次循環(huán)，然后繼續(xù)循環(huán)中的下一個迭代。