3.7 循環(huán)語句

必備知識：前面課程的學習

循環(huán)語句

循環(huán)語句是一系列反復執(zhí)行直到符合特定條件的命令。JavaScript 支持for，do while，while這些循環(huán)語句，還有 Label（label 本身不是一個循環(huán)語句，但是經(jīng)常和這些語句一起使用）。另外，你可以在循環(huán)語句中使用break和continue語句。

需要注意的是，還有另一種比較高級的循環(huán)語句：for each...in，但它是用來操作對象的。

綜上，循環(huán)語句有以下幾種：

• for Statement
• do...while Statement
• while Statement
• label Statement
• break Statement
• continue Statement

我們一個一個來看。

for 語句

for 循環(huán)反復直到一個特定的條件計算為假。JavaScript 中的循環(huán)和 Java 以及 C 中的循環(huán)相似。for 語句如下所示：

for ([initialExpression]; [condition]; [incrementExpression]) {
   statement
}

在一個for 執(zhí)行的過程中，會發(fā)生以下事情：

1. [initialExpression]：初始化表達式，若存在則執(zhí)行。此表達式通常初始化了一個或多個循環(huán)用計數(shù)器，語法上也允許設定一個任意復雜度的表達式。表達式里還可以聲明變量。
2. [condition]：條件表達式。如果表達式的值為 true，將執(zhí)行循環(huán)語句；若為 false，循環(huán)終止。若要完全忽略此條件表達式，則設此表達式的值為 true。
3. statement：需執(zhí)行的語句。如果要執(zhí)行多條語句，就要用中括號（{...}）把語句括起來。
4. [incrementExpression]：累計表達式。若存在則執(zhí)行，然后會回到第2步執(zhí)行語句。

例如下面的這個函數(shù)包含了一個 for 語句，用來計算一個選擇列表（一個可以多選的選擇列表）中被選擇項目的數(shù)量。這個 for 語句定義了一個初始化值為 0 的變量 i，它檢查 i 小于選擇列表的項目數(shù)量，然后執(zhí)行了 for 循環(huán)里面的 if 語句，每次循環(huán)后 i 則自動加 1。

<script type="text/javascript">

function howMany(selectObject) {
   var numberSelected = 0;
   for (var i = 0; i < selectObject.options.length; i++) {
      if (selectObject.options[i].selected)
         numberSelected++;
   }
   return numberSelected;
}

</script>
<form name="selectForm">
   <p>
      <strong>Choose some music types, then click the button below:</strong>
      <br/>
      <select name="musicTypes" multiple="multiple">
         <option selected="selected">R&B</option>
         <option>Jazz</option>
         <option>Blues</option>
         <option>New Age</option>
         <option>Classical</option>
         <option>Opera</option>
      </select>
   </p>
   <p>
      <input type="button" value="How many are selected?"
         onclick="alert ('Number of options selected: ' + howMany(document.selectForm.musicTypes))"/>
   </p>
</form>

do...while 語句

do...while 語句反復直到一個特定條件計算為假。do...while 語句如下所示：

do
   statement
while (condition);

語句（statement）會在條件判斷前執(zhí)行一次。如果要執(zhí)行多條語句，就要用中括號（{...}）把語句括起來。如果條件表達式（condition）為 true，語句將再次執(zhí)行。在每次語句執(zhí)行完畢時，會執(zhí)行條件判斷。如果條件表達式（condition）為 false，執(zhí)行停止并跳到 do...while 后繼續(xù)執(zhí)行下面的語句。

在下面的例子中，do 循環(huán)至少迭代一次，然后重復執(zhí)行直到 i 不再小于 5。

do {
   i += 1;
   console.log(i);
} while (i < 5);

while 語句

while 語句只要一個特定條件計算為真就執(zhí)行語句。如下所示：

while (condition)
   statement

如果條件表達式（condition）為 false，在循環(huán)體內(nèi)的語句停止執(zhí)行，然后跳到循環(huán)體后的語句繼續(xù)執(zhí)行。

條件（condition）在循環(huán)體內(nèi)的語句執(zhí)行之前進行判斷。如果條件表達式（condition）為 false，語句（statement）將會試行并且條件會再次進行判斷。如果條件表達式（condition）為 false，執(zhí)行停止，然后跳到 while 循環(huán)體后的語句執(zhí)行。

如果要執(zhí)行多條語句，就要用中括號（{...}）把語句括起來。

例如，下面的 while 循環(huán)只在 n 小于 3 的時候反復執(zhí)行：

n = 0;
x = 0;
while (n < 3) {
   n++;
   x += n;
}

在每次迭代中，循環(huán)計數(shù)器 n 會增加 1 并會與 x 相加。因此，x 與 n 在每次迭代中的值為：

1. 第一次執(zhí)行后：n=1，x=1；
2. 第二次執(zhí)行后：n=2，x=3；
3. 第三次執(zhí)行后：n=3，x=6。

在第三次執(zhí)行完成后，條件判斷 n<3 不再為 true，循環(huán)終止。

注：構造循環(huán)語句時，應當避免死循環(huán)。
例如：
下面的語句將一直循環(huán)，因為它的條件永遠不會變?yōu)?false:

while (true) alert("Hello, world");

對象操作語句

JavaScript 用 for...in, for each...in 和 with 語句來操作對象。

for...in 語句

for...in 語句迭代一個指定的變量去遍歷這個對象的屬性，每個屬性，javascript 執(zhí)行指定的語句。一個for...in 語句示例如下：

for (variable in object) {
   statements
}

for each...in 語句

它和 for...in 相似，但是讓對象屬性的值遞回取得，而不是作用于它們的名字。

var sum = 0;
var obj = {prop1: 5, prop2: 13, prop3: 8};
for each (var item in obj) {
  sum += item;
}
print(sum); // prints "26", which is 5+13+8

本節(jié)任務

• 學習慕課網(wǎng)提供的
  《JavaScript進階篇》中 4-1 至 4-4 的內(nèi)容，并完成練習。