JavaScript | ゼロからはじめるプログラミング、30日で基礎を学ぶJavaScript:JavaScriptを使えるレベルにする - Day11.5:条件分岐の応用 練習問題

JavaScript JavaScript
スポンサーリンク

Day11.5 条件分岐の応用の練習問題

三項演算子と switch は、JavaScript の条件分岐を「短く」「読みやすく」「安全に」書くための重要ツールです。
ここでは、初心者でも確実に理解できるように、実践的な練習問題と解答・解説をまとめます。


三項演算子の練習問題

問題1:合否判定を三項演算子で書く

次の score に応じて、
70点以上なら「合格」、それ以外なら「不合格」
という文字列を result に代入してください。

const score = 65;
JavaScript

解答と解説

const result = score >= 70 ? "合格" : "不合格";
console.log(result);
JavaScript

三項演算子は「条件 ? 真のときの値 : 偽のときの値」という形で、
if-else を1行にまとめられます。
「値を選ぶだけ」の場面では最も読みやすい書き方です。


問題2:ログイン状態でメッセージを切り替える

isLoggedIn が true なら「ようこそ」、false なら「ログインしてください」
というメッセージを message に代入してください。

const isLoggedIn = false;
JavaScript

解答と解説

const message = isLoggedIn ? "ようこそ" : "ログインしてください";
console.log(message);
JavaScript

三項演算子は「2択のラベル付け」に非常に向いています。
if を使うよりも、意図が短く明確に伝わります。


switch の練習問題

問題3:信号の色でメッセージを変える

color が “red” なら「止まれ」
“yellow” なら「注意」
“green” なら「進め」
それ以外なら「不明な信号」
というメッセージを表示してください。

const color = "yellow";
JavaScript

解答と解説

let message;

switch (color) {
  case "red":
    message = "止まれ";
    break;
  case "yellow":
    message = "注意";
    break;
  case "green":
    message = "進め";
    break;
  default:
    message = "不明な信号";
    break;
}

console.log(message);
JavaScript

switch は「同じ変数を複数の値で分岐したい」場面に最適です。
if-else の連続よりも、パターンが一覧で見えて読みやすくなります。


問題4:HTTP ステータスコードでメッセージを切り替える

status が
200 → 「成功」
400 → 「リクエストエラー」
404 → 「見つかりません」
それ以外 → 「不明なステータス」
となるように switch を書いてください。

const status = 404;
JavaScript

解答と解説

let message;

switch (status) {
  case 200:
    message = "成功";
    break;
  case 400:
    message = "リクエストエラー";
    break;
  case 404:
    message = "見つかりません";
    break;
  default:
    message = "不明なステータス";
    break;
}

console.log(message);
JavaScript

switch は「コード値に応じた処理」を書くときに非常に強力です。
実務では API のレスポンス処理で頻出します。


三項演算子 × switch の応用問題

問題5:年齢によってバッジを決める(三項演算子)

age が
20以上 → “大人”
20未満 → “未成年”
となるように badge を三項演算子で作ってください。

const age = 17;
JavaScript

解答と解説

const badge = age >= 20 ? "大人" : "未成年";
console.log(badge);
JavaScript

三項演算子は「単純な2択の分類」に最適です。


問題6:ユーザーの役割によって権限を決める(switch)

role が
“admin” → “フルアクセス”
“user” → “通常アクセス”
“guest” → “閲覧のみ”
それ以外 → “アクセス不可”
となるように switch を書いてください。

const role = "guest";
JavaScript

解答と解説

let permission;

switch (role) {
  case "admin":
    permission = "フルアクセス";
    break;
  case "user":
    permission = "通常アクセス";
    break;
  case "guest":
    permission = "閲覧のみ";
    break;
  default:
    permission = "アクセス不可";
    break;
}

console.log(permission);
JavaScript

switch は「状態管理」「権限管理」など、
実務で非常に多く使われるパターンです。


セキュリティ視点の練習問題

問題7:未知の role を安全に扱う

次のコードは、未知の role が来たときに危険です。
switch を使って、未知の role の場合は必ず “アクセス拒否” にしてください。

const role = "unknown";
JavaScript

解答と解説

let permission;

switch (role) {
  case "admin":
    permission = "フルアクセス";
    break;
  case "user":
    permission = "通常アクセス";
    break;
  default:
    permission = "アクセス拒否";
    break;
}

console.log(permission);
JavaScript

default を「安全側」に倒すことで、
未知の値が来ても誤って権限を与える事故を防げます。
これはセキュリティ設計の基本です。


Day11.5 練習問題まとめ

三項演算子は「短い2択の値選択」に最適。
switch は「複数パターンの分岐を一覧で整理」するのに最適。
default を安全側に倒すことで、セキュリティも強化できる。

この2つを使いこなせると、
条件分岐の質が一気に上がり、
読みやすく安全なコードが書けるようになります。

タイトルとURLをコピーしました