JavaScriptでwhile文から途中で抜け出す方法

この記事では、JavaScriptのwhile文を途中で抜け出す方法について見ていきたいと思います。

while文とは

while文は、指定した条件を満たしている間はループ処理を繰り返すという構文です。

while文の書き方

while(条件) {
処理
}

while文を途中で抜け出す方法

while文を途中で抜け出すには「break」を用います。
では、早速例を見ていきましょう。

while文でbreakを用いる例

・HTML

<p id="result"></p>

・JavaScript

let i = 1;
let sum = 1;
let result = document.getElementById("result");

while(i >= 1) {
  sum *= i;
  i++;
  if(i > 5) {
    break;
  }
}

result.textContent = "1から5までの数字を掛けた値は" + sum + "です。";

この例では、while文で変数「i」が1以上の間はループを続けるという内容になっていますね。
ループ処理の内容は、変数「sum」に変数「i」を掛けてから「i」に1を加算するという形になっています。
なので、このままだと「i」はずっと1以上のままなので無限ループになってしまいます。
そこで、その後にif文を用いて、その条件を満たした場合に「break」を実行させることで、while文から離脱させることができます。

では、結果を見てみましょう。
「Result」タブをクリックすると

こうですね。
ちゃんと1から5までを掛けた数値が出力されていますね。

まとめ

このように、while文の中で「break」を用いることで、実行中のループ処理から離脱することができます。