JavaScriptのプログラム実行フロー
プログラムが実行される順序を制御することを「制御フロー(Control Flow)」と呼びます。JavaScriptでは、上から下へ順番に実行される「順次進行」、条件によって処理を分ける「条件分岐」、同じ処理を繰り返す「反復」の3つが基本要素となります。
1. 条件分岐構造
1.1 if 文のバリエーション
特定の条件が満たされた場合にのみ処理を実行します。単一の if、二者択一の if...else、そして複数の条件を評価する if...else if があります。
// 成績判定の例
const score = Number(prompt('スコアを入力してください (0-100):'));
if (score >= 90) {
console.log('評価: S');
} else if (score >= 80) {
console.log('評価: A');
} else if (score >= 70) {
console.log('評価: B');
} else if (score >= 60) {
console.log('評価: C');
} else {
console.log('評価: D (再試験)');
}
1.2 三項演算子(条件演算子)
簡単な条件分岐を1行で記述できる構文です。条件 ? 真の場合の式 : 偽の場合の式 の形式をとります。
// 10未満の数字に0を付与する(ゼロパディング)
const inputVal = prompt('数値を入力してください:');
const result = inputVal < 10 ? '0' + inputVal : inputVal;
console.log('結果:', result);
1.3 switch 文
特定の変数の値に対して、複数の選択肢(case)を比較する場合に適しています。比較は厳密等価(===)で行われます。
- 各
caseの最後にはbreakを記述して、後続の処理へのフォールスルーを防ぎます。 - どのケースにも該当しない場合は
defaultが実行されます。
2. 反復構造(ループ)
2.1 for 文
指定した回数だけ処理を繰り返す際に最も一般的に使用されます。
// 指定された数だけ記号を連結する
const count = Number(prompt('繰り返す回数を指定してください:'));
let output = '';
for (let i = 0; i < count; i++) {
output += '■';
}
console.log(output);
2.2 二重ループ(入れ子の構造)
ループの中にさらにループを記述することで、多次元的な処理(行列や格子状の出力)が可能になります。
// 直角三角形のパターン表示
const rows = Number(prompt('三角形の段数を入力:'));
for (let i = 1; i <= rows; i++) {
let line = '';
for (let j = 1; j <= i; j++) {
line += '★';
}
console.log(line);
}
// 九九の表をコンソールに出力
let table = '';
for (let i = 1; i <= 9; i++) {
for (let j = 1; j <= 9; j++) {
table += `${j}×${i}=${i * j}\t`;
}
table += '\n';
}
console.log(table);
2.3 while 文と do...while 文
while はループの開始前に条件を評価し、do...while は少なくとも一度処理を実行してから条件を評価します。
3. ループの制御: continue と break
ループの挙動を詳細に制御するためのキーワードです。
- continue: 現在の反復処理を中断し、次のループサイクルへ即座にスキップします。
- break: ループ自体を完全に終了し、ブロックの外へ抜けます。
4. コーディング規約と命名規則
JavaScript開発における可読性を高めるための標準的なルールです。
4.1 識別子の命名
- 変数名や関数名にはキャメルケース(camelCase)を使用します(例:
userScore)。 - 定数(再代入しない値)にはアッパースネークケースを使用することが一般的です(例:
MAX_LIMIT)。
4.2 演算子とスペース
- 演算子の前後には半角スペースを入れ、可読性を確保します(例:
a + b)。 - コードブロックの
{ }の前後には適切な改行とインデントを適用します。