JavaScriptのフローチャートでwhileループをわかりやすく図解する方法

whileループの目的は、指定した条件式がtrue（真）である限り、ステートメントやコードブロックを繰り返し実行することです。条件式がfalse（偽）と評価された時点で、ループは自動的に終了します。

whileループの基本構造

JavaScriptにおけるwhileループは、次のような構文で記述します。

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

フローチャートで見るwhileループの流れ

whileループの動作をフローチャートで表すと、処理の流れがひと目で把握できます。フローチャートは主に以下の要素で構成されています。

• 開始： 処理全体の起点となるノードです。
• 条件判定（ひし形）： 条件式がtrueかfalseかを評価します。
• 処理本体（長方形）： 条件がtrueの場合に実行されるコードブロックです。
• 更新処理： カウンタ変数のインクリメントなど、次の反復に向けた準備を行います。
• 終了： 条件がfalseになった時点でループを抜け、後続の処理へ進みます。

処理の流れのポイント

フローチャート上では、まず条件判定が行われ、結果がtrueであれば処理本体を実行した後に再び条件判定へ戻ります。この「判定 → 実行 → 判定」というサイクルが、条件式がfalseになるまで繰り返されるのがwhileループの基本的な動作です。

また、whileループは前置判定型（事前条件ループ）と呼ばれます。これは、ループ本体を実行する前に必ず条件チェックが行われることを意味します。そのため、条件式が最初からfalseと評価される場合は、本体のコードが一度も実行されない点に注意しましょう。