在 JS 裡面，迴圈有幾種形式：

• do...while...

先做再說：do...while...

因為程式碼是從上到下執行，所以

無論如何，「do 大括號」一定會先執行一次，才會去判斷「while 的條件」

也就是說，就算「while 的條件」從一開始就不成立，「do 大括號」還是會被執行一次

記住！

• 小括號 裡面放「條件」
• 大括號 代表「一個區塊」，裡面放「要執行的程式碼」

語法

• 在 do 後面接「大括號」（因為大括號就代表“一個區塊 block”）
• 在 while 後面接「小括號」，裡面放「條件」

var i = 1

do {
  console.log(i)
  i++
} while (i <= 100)

console.log('finished!')

另一種寫法：
當 i > 100 就會 break（跳出 do...while... 的區塊）

var i = 1

do {
  console.log(i)
  i++
  if(i > 100){
    break
  }
} while (true)

console.log('finished!')

使用 break 跳出整個迴圈

使用 continue 直接進入下一圈

var i = 1

do {
  console.log(i)
  i++
  if(i % 2 === 1){
    continue
  }
  console.log('這個 i 是偶數')
} while (i <= 100)

console.log('finished!')

使用 continue 就代表「直接跳到下一圈」（還是會先檢查 while 的條件是否成立）

所以，只要 i % 2 === 1 是 true（代表 i 是奇數），就不會往下執行到 console.log('這個 i 是偶數') 這行，而會直接跳到「while 的條件判斷」，當條件是 true 就進入下一圈

output:

1
這個 i 是偶數
2
3
這個 i 是偶數
4
5
這個 i 是偶數
6
7
這個 i 是偶數
...

while 迴圈

「while 迴圈」跟「do...while...迴圈」的執行順序剛好相反

先判斷 while 條件，條件成立再去執行大括號的程式碼

「while 迴圈」跟 for loop 有一樣的「結構 & 執行順序」

結構都是「先一個小括號，再接一個大括號」

while () {

}

for () {

}

var i = 1

while (i <= 100) {
  console.log(i)
  i++
}

console.log('finished!')

另一種寫法：

把 i++ 直接寫在 console.log() 裡面

var i = 1

while (i <= 100) {
  console.log(i++)
}

console.log('finished!')

因為，console.log(i++) 這句的執行順序會是：

1. 先執行 console.log(i)
2. 再執行 i++

   可參考 把 ++ 放在“後面”跟放在“前面”的差別在哪呢？

while 迴圈也可以使用 continue 和 break

無窮迴圈

如果不小心寫出無窮迴圈，可以按 ctrl + C 來中斷執行程式，否則電腦會當機（資源都被吃光了）

下面兩種方式可以寫出無窮迴圈：

1. 在 while 小括號裡面寫 true

var i = 1

while (true) {
  console.log(i)
  i++
}

console.log('finished!')

1. 在 while 小括號裡面寫 1 （因為 1 就是 true 的意思）

var i = 1

while (1) {
  console.log(i)
  i++
}

console.log('finished!')

使用時機

在多數情況下，都會使用「while 迴圈」，因為可以先判斷條件

除非，你很確定「第一次一定會執行」，才會用到「do…while…迴圈」

for loop

for loop 使用時機

for loop 通常會用在：我已經知道會有多少圈

for loop 語法

最常見的迴圈，會需要這三個要素：

1. 初始值
2. 終止條件
3. i 每一圈要做的事情

所以，for loop 的語法就是這樣：

for (初始值; 終止條件; i 每一圈要做的事情){

}

for(var i=1; i<=100; i++){
  console.log(i)
}

把初始值寫在外面

也可以這樣寫：
把初始值 var i = 1 寫在外面

注意！小括號的最前面還是要寫一個「分號 ;」，因為小括號裡面一定要有三個條件，否則程式會出錯

var i = 1
for(; i<=10; i++){
  console.log(i)
}

「for loop」跟「while 迴圈」的執行順序一樣

執行順序是：

1. var i=1
2. 檢查條件 i<=100
3. 如果條件成立，才會執行 console.log(i)
4. 然後 i++
5. 檢查條件 i<=100
6. 如果條件成立，才會再次執行 console.log(i)

for loop 也可以使用 continue 和 break

continue

範例一：印出 1~10 的偶數
當 i % 2 === 1 （i 是奇數）就不會執行到 console.log(i) 這行

for(var i=1; i<=10; i++){
  if(i % 2 === 1) continue
  console.log(i)
}

也可以寫成：
因為 1 就是 true

for(var i=1; i<=10; i++){
  if(i % 2) continue
  console.log(i)
}

output:

2
4
6
8
10

範例二：
當 i === 3 就不會執行到 console.log(i) 這行

for(var i=1; i<=5; i++){
  if(i === 3) continue
  console.log(i)
}

output:

1
2
4
5

break

for(var i=1; i<=5; i++){
  if(i === 3) break
  console.log(i)
}

output:

1
2