iT邦幫忙

2022 iThome 鐵人賽

DAY 12
0

迴圈可以重複執行同一組程式碼,幫我們處理不斷重複的事情。迴圈會檢測條件,如果條件為 true,便會執行程式碼;接著條件繼續被檢測、程式碼繼續執行,直到條件為 false 為止。

FOR 基本

  • for 迴圈用來重覆執行 for 區塊內的語句。

for (初始值; 條件; 結束時的變動) {
  // 重複執行的動作
}
  • 其中 initialExpression 是初始化語句,在迴圈第一次執行之前,會先執行 initialExpression
  • 在每一次執行迴圈之前,都會先執行 condition 條件式,如果值是 true 則執行迴圈,false 則跳出 for 迴圈
  • 而在每一次執行完迴圈之後,都會執行 incrementExpression 語句

例:

var counter = 0;
for (var i = 0; i < 5; i++) {
    counter += i;
}
  1. 在迴圈開始之前,會先初始化變數 i = 0
  2. 當每一次迴圈開始執行之前,會判斷 i 是否小於 5,如果大於 5 則跳出迴圈,小於 5 則執行迴圈內容
  3. 而每當執行完一次迴圈後,會將變數 i 加 1
  4. 所以每一個迴圈,變數 i 分別會是 0, 1, 2, 3, 4, 5,直到 i 的值變成 5 時則跳出迴圈
  5. 所以上面的迴圈執行完後,最後 counter 的值會是 10!

break應用

執行迴圈時,不一定要從頭到尾都做完,有時候只要找到一個符合條件的值,後面就可以不用跑程式碼了。如果是這種情形,那就可以用 break 退出迴圈

break 在 if 裡:

for (var i=0; i<denny.length; i++) {
  if (denny[i].apple>20) {
    console.log(denny[i].denny + '的apple有超過20個')
    break;
  }
  console.log('apple不夠多'); // 因為在 break 後面所以不執行
}

break 放在 if 裡的意思是,當條件滿足 apple > 20 時整個迴圈就會終止,此時 break 後方的程式碼都不會執行。

break 在 if 的外面、for 的裡面:

for (var i=0; i<denny.length; i++) {
  if (denny[i].apple>20) {
    console.log(denny[i].farmer + '的apple有超過20個')
  }
  break;
}

break 放在 if 外面 for 迴圈裡面,是指不管條件是否成立 for 迴圈都只執行一次。迴圈在if撈出符合條件的第一筆資料後就會停止,甚至 if 條件沒成立時,也會執行一次,只不過輸出的結果是 undefined。

continue 應用

用來讓程式跳過迴圈剩餘的程式碼,直接執行下一次迴圈。

var counter = 0;
for (var i = 0; i < 5; i++) {
    if (i < 3) {
        continue;
    }
    counter += i;
}

當 for 迴圈執行完後 counter 的值會是 7,因為當 i 等於 0, 1, 2 的時候都被跳過 continue 之後的程式碼,直到 i 等於 3, 4 的時候才會執行迴圈內容。

參考1
for 迴圈與 forEach 有什麼不同
function


上一篇
forEach 陣列資料處理
下一篇
function函式
系列文
JavaScript亂記30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言