JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

【初心者向け】JavaScriptのwhileループ文とは？基本構文と使い方をわかりやすく解説

JavaScriptにおける最も基本的な繰り返し処理（ループ）がwhileループです。whileループは、指定した条件式が「true（真）」である限り、ステートメントやコードブロックを繰り返し実行するための構文です。条件式が「false（偽）」に評価された時点で、ループは終了します。

whileループの基本構文

JavaScriptにおけるwhileループの構文は以下の通りです。

while (条件式) {
  // 条件式がtrueの間、繰り返し実行される処理
}

この構文の動作の流れは次のようになります。

1. まず条件式が評価されます。
2. 条件式がtrueであれば、ブロック内の処理が実行されます。
3. 処理が完了すると再び条件式に戻り、評価を繰り返します。
4. 条件式がfalseになった瞬間にループを抜け、次の処理へ移行します。

whileループのサンプルコード

実際にwhileループを使った簡単な例を見てみましょう。以下のコードでは、変数countが10未満である間、現在のカウント値を出力し続けます。

<html>
  <body>
    <script>
      var count = 0;
      document.write("ループ開始 <br/>");

      while (count < 10) {
        document.write("現在のカウント : " + count + "<br/>");
        count++;
      }

      document.write("<br/>ループ終了！");
    </script>
  </body>
</html>

実行結果

ループ開始
現在のカウント : 0
現在のカウント : 1
現在のカウント : 2
現在のカウント : 3
現在のカウント : 4
現在のカウント : 5
現在のカウント : 6
現在のカウント : 7
現在のカウント : 8
現在のカウント : 9

ループ終了！

whileループ使用時の注意点

whileループを使用する際は、無限ループに陥らないよう注意が必要です。ループ内で条件式に関わる変数（上記の例ではcount）を必ず更新しないと、条件式が永遠にfalseにならず、ブラウザがフリーズしてしまうことがあります。

また、条件式の判定が処理の前に行われるのがwhileループの特徴です。そのため、最初から条件式がfalseの場合は、ブロック内の処理は一度も実行されません。「最低でも1回は処理を実行したい」という場合は、判定後置型のdo...while文の利用を検討するとよいでしょう。

  1. JavaScriptのwhileループとは？基本構文と動作例をわかりやすく解説

    whileループは、指定した条件式がtrue（真）である限り、特定の文やコードブロックを繰り返し実行するための制御構造です。条件式がfalse（偽）に評価された瞬間に、ループは終了し、その後の処理へと進みます。 whileループの基本構文 while (条件式) { // 繰り返し実行したい処理 } whileループは、まず最初に条件式を評価します。条件がtrueであればブロック内の処理を実行し、再び条件式に戻って評価を行います。この流れを図にすると以下のようになります。 サンプルコード 実際に簡単な例を見てみましょう。変数 i をカウンターとして使い、5回「Hello」を出力するプ

  2. JavaScriptのwithステートメントとは？用途と使い方をわかりやすく解説

    JavaScriptのwithステートメントは、特定のプロパティに対してデフォルトのオブジェクトを指定し、冗長になりがちなオブジェクト参照の記述を省略するための構文です。withブロック内で指定したオブジェクトは、スコープチェーンの先頭に追加されるため、そのプロパティ名だけで直接アクセスできるようになります。 基本的な動作 通常、オブジェクトのプロパティにアクセスするには、毎回オブジェクト名を明示する必要があります。しかし、withステートメントを使えば、以下のようにコードを簡潔に書けます。 オブジェクト名の繰り返し記述を省略できる 同じオブジェクトの複数のプロパティへ短くアクセスできる 指