在之前的文章中,我們帶大家學習了JS中的幾種循環控制結構(while和do-while循環、for循環),下面聊聊跳出循環語句break和continue,希望對大家有所幫助!

通過前面對循環的學習我們知道,默認情況下循環會在表達式結果為假時自動退出循環,否則循環會一直持續下去。某些情況下,我們不用等待循環自動退出,可以主動退出循環,JavaScript 中提供了 break 和 continue 兩個語句來實現退出循環和退出(跳過)當前循環。
1、continue語句
continue 語句用來跳過本次循環,執行下次循環。當遇到 continue 語句時,程序會立即重新檢測條件表達式,如果表達式結果為真則開始下次循環,如果表達式結果為假則退出循環。
【示例1】使用 continue 語句跳出 for 循環:
<script type="text/javascript"> for (var i = 1; i < 10; i++) { if(i % 2 != 0) { continue; } console.log(i); } </script>
分析:
-
for (var i = 0; i < 10; i++){}語句可以循環得出1~10 之間的所有數字 -
if(i % 2 != 0)語句用于判斷i的值能否整除2,不能整除則()中值為true,則執行continue;語句。 -
在循環體中,使用
if(i % 2 == 0)語句進行判斷,如果i的值能整除2就使用“console.log(i);”輸出;如果i的值不能整除2,則觸發continue;語句,跳出本次循環(不進行輸出),執行下一次循環。
輸出結果:

2、break語句
break語句用于跳出當前的語法結構,可以終止循環體的代碼并立即跳出當前的循環,執行循環之后的代碼(如果有的話)。
break和continue的不同點是:continue語句只是結束本次循環,而 break 語句會終止整個循環的執行。
沿用上面的示例1中代碼,將continue;換成break;,會輸出什么?
<script type="text/javascript"> for (var i = 1; i < 10; i++) { if(i % 2 != 0) { break; } console.log(i); } </script>
答案是:什么也不輸出。為什么會這樣尼?我們來分析一下:
forx循環一開始,i=1,1小于10嗎?當然,然后開始執行循環體中的if(i % 2 != 0)語句;
那么1能整除2嗎?顯然是不能,因此()中值為true,則執行if中的“break;”語句,直接跳出整個循環了,根本沒有機會執行“console.log(i);”語句。
值得注意的是,break和continue都只對當前循環有效。如果我們有嵌套循環,那么就要很小心了。不妨來看下面的例子:
for (let i = 0; i < 5; i++) { if (i % 2 == 0) continue; for (let j = 0; j < 5; j++) { if (j == 2) break; console.log(`i = ${i}, j = ${j}`); } }
這里我們有兩個循環,每一個都會執行 5 次(0~4)。外層的循環在 i 是偶數的時候,跳過當前循環執行下一個。也就是說只有 i 為 1 或則 3 的時候,才會執行內層的循環。
內層的循環只要 j 的值為 2,就終止了。因此,j 只有 0 和 1。
最終結果如下:

4、JavaScript 標簽
從 JavaScript 1.2 開始,可以將標簽與 break 和 continue 結合使用,來更精確的控制程序的執行。
JavaScript 中的標簽與 HTML 中的標簽不同,JavaScript 中的標簽就是一個標識符(類似變量名),后面跟隨一個冒號:。JavaScript 標簽可以聲明在任何語句或者代碼塊之前,并與 break 或 continue 配合來跳出特定的循環,例如當多個循環嵌套使用時,單純使用 break 只能跳出當前的循環,無法跳出外層循環,如果將 break 與標簽配合使用,則可以一次跳出多層循環。
示例代碼如下:
<script type="text/javascript"> document.write("開始循環!<br /> "); outerloop: // 定義一個標簽 for (var i = 0; i < 5; i++) { document.write("外層循環: " + i + "<br />"); innerloop: // 定義一個標簽 for (var j = 0; j < 5; j++) { if (j > 3 ) break ; // 跳出內層循環 if (i == 2) break innerloop; // 跳出內層訊息 if (i == 4) break outerloop; // 跳出外層循環 document.write("內層循環: " + j + " <br />"); } } document.write("循環結束!<br /> "); </script>

注意:break 或 continue 與標簽之間不能出現換行。另外,標簽名稱和相關循環之間不能出現其它代碼。
【推薦學習:javascript高級教程】
站長資訊網