「実務で if / else if / else をどう使うのか？」をイメージできると、学習が一気に現実的になります。ここでは Web開発や業務システムでよくあるシナリオ を例に、コードと解説を交えて紹介します。
例1：ECサイトの送料計算
シナリオ:
ネットショップで注文金額に応じて送料を変える。
const amount = 4200; // 注文金額（円）
let shippingFee;
if (amount >= 10000) {
shippingFee = 0; // 1万円以上は送料無料
} else if (amount >= 5000) {
shippingFee = 250; // 5000円以上は250円
} else {
shippingFee = 500; // それ未満は500円
}
console.log(`送料は${shippingFee}円です`);
解説:
- 実務では「金額のしきい値」で条件分岐することが多いです。
- 上から順にチェックするので「高額条件を先に書く」のが鉄則。
- else を使って「それ以外」をまとめると漏れがなくなります。
例2：ユーザー権限による画面表示
シナリオ:
ログインしたユーザーの権限に応じて表示を切り替える。
const role = "editor"; // "admin" | "editor" | "viewer"
if (role === "admin") {
console.log("管理者メニューを表示");
} else if (role === "editor") {
console.log("記事編集メニューを表示");
} else {
console.log("閲覧専用メニューを表示");
}
解説:
- 実務では「ユーザーの役割（ロール）」で処理を分けるのが定番。
- 文字列比較を使う場合は、タイプミスを防ぐために定数や列挙型を使うのがベストプラクティス。
- 例:
const ROLE_ADMIN = "admin";のように定義して使う。
例3：勤務シフトの判定
シナリオ:
時間帯によって勤務区分を判定する。
const hour = 14; // 現在の時刻（0〜23）
if (hour >= 9 && hour < 12) {
console.log("午前シフト");
} else if (hour >= 12 && hour < 18) {
console.log("午後シフト");
} else if (hour >= 18 && hour < 22) {
console.log("夜間シフト");
} else {
console.log("深夜シフト");
}
解説:
- 実務では「時間帯ごとの処理」がよく出てきます（シフト管理、営業時間判定など）。
&&を使って範囲を指定するのがポイント。- else を最後に置くことで「どの範囲にも当てはまらない場合」をカバーできます。
例4：メール送信の条件分岐
シナリオ:
ユーザーの状態に応じて送信するメールを変える。
const isNewUser = true;
const hasUnpaidInvoice = false;
if (isNewUser) {
console.log("ようこそメールを送信");
} else if (hasUnpaidInvoice) {
console.log("支払い催促メールを送信");
} else {
console.log("定期ニュースレターを送信");
}
解説:
- 実務では「ユーザーの状態フラグ」による分岐が頻出。
- 条件が増えると複雑になるので、場合によっては switch文 や オブジェクトマッピング に置き換えることもあります。
まとめ
- 実務での
ifは「金額」「権限」「時間」「状態フラグ」などを判定する場面で多用される - 順番が重要（厳しい条件を先に書く）
- else を活用して抜け漏れを防ぐ
- 条件が増えすぎたら
switchやマッピングにリファクタリングするのが現場流