条件で繰り返しを中断する - break文
break文
- for文やwhile文で、指定した回数だけ処理を繰り返す途中で「中断」する
- switch文でのbreak文は、ブロックの外へ抜けるための構文でした
- break文をwhile文やfor文のブロック内に記述することで、継続条件式がtrueであっても強制的にブロックの外へ抜けることができます
《for文とbreak文》
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>for文とbreak文</title> <script> var tickets = [ 290, 296, 299, 301, 305 ]; for (var i = 0; i < tickets.length; i++) { if (tickets[i] >= 300) { break; } console.log(tickets[i]); } console.log('終了'); </script> </head> <body> </body> </html>
《実行結果》
- 配列の要素数が「5」であるため、for文は「0~5未満」の間、計5回繰り返す条件になっています
- 配列要素の値が300位上になった時点(4回目)でbreak文によって繰り返しを抜けています
《例》
<script> for (var a = 1; a <= 5; a++) { if ((a + 2) == 5) { break; } document.write(a + '+2=' + (a + 2) + '<br>'); } document.write('ループ終了'); </script>
《実行結果》
処理の中断
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>繰り返し処理と中断</title> <script> var i = 1; function ans(){ switch ( i ) { case 1: alert('【ヒント】北海道は県ではありません'); break; case 2: alert('【ヒント】東北地方にある県です'); break; default: alert('答えは岩手県です'); } i++; } </script> </head> <body> <h3>(問題)</h3> <p>日本で最も面積が大きい“県”は何県でしょう?</p> <p><button onclick="ans()">答えを見る</button></p> <p> ※ボタンのクリックが2回までの間はヒントが表示されます。<br> ※ボタンを3回以上クリックすると、答えが表示されます。 </p> </body> </html>
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>繰り返し処理</title> </head> <body> <h3>合計</h3> <p>以下のボタンをクリックすると、<br> 入力した数字までの合計は「100」を超えた段階を表示します。</p> <p><button onclick="total()">数字を入力する</button></p> <script> function total(){ var ans = 0; var maxNum; var bkNum = 100; maxNum = prompt('数字を入力してください。', '半角数字'); for (i=1 ; i<=maxNum ; i++){ ans = ans + i; if(ans >= bkNum) { break; } } alert('1~' + i + 'の合計は' + ans+ 'です'); } </script> </body> </html>
無限ループとbreak文
- while文の条件式に「true」とだけ記述すると、常に条件式が成立することになります
- したがって処理を延々繰り返す、「無限ループ」となります
- 「無限ループ」のままではプログラムが終了しないため、ブロック内に適切な「if文」と「break文」を置く必要があります
条件式はどんなとき成立するか
- JavaScriptでは、「0」、「undefined」、「false」、「空文字列(長さが0の文字列)」の値以外であれば、条件が成り立つと判断されます
- while (1)でも、無限ループになります
ループの中断
<!DOCTYPE html> <html lang='ja'> <head> <meta charset='UTF-8'> <title>ループの中断</title> </head> <body> <script> var ans = 5; var num; var msg = '1~10までの数字を入力してください'; while (true) { num = prompt(msg, '半角数字を入力'); if (ans == num) { document.write('<h1>正解です</h1>'); break; } if (num < ans ) { msg = 'もっと大きい数を入力してください'; } else if (num > ans ) { msg = 'もっと小さい数を入力してください'; } else { msg = '数を入力してください'; } } </script> </body> </html>
continue文
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>continue文</title> </head> <body> <script> var a, b; b = 1; for (a = 0; a < 4; a++) { if (a + b == 2) continue; document.write(a + '+' + b + '=' + (a + b) + '<br>'); } </script> </body> </html>
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>continueの利用</title> </head> <body> <h3>2または3で割り切れない数値</h3> <p>1~100までの場合</p> <script> for (i=1 ; i<=100 ; i++){ if(i % 2 == 0 || i % 3 == 0) { continue; } document.write(i + ' '); } </script> </body> </html>
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>for文とcontinue文</title> <script> var tickets = [ '指定席', '自由席', '指定席', '自由席', '指定席' ]; for (var i = 0; i < tickets.length; i++) { if (tickets[i] == '自由席') { continue; } console.log(i + ' : ' + tickets[i]); } console.log('終了'); </script> </head> <body> </body> </html>
まとめ
- while文の条件式に「true」を設定すると、無限ループになる
- 無限ループから脱出するには、if文とbreak文を使う