JavaScriptの条件式を応用した便利な書き方まとめ

1. 三項演算子で簡潔に条件分岐

1. 三項演算子で簡潔に条件分岐

三項演算子とは、条件式を一行で書ける便利な書き方です。書き方は「条件 ? 値1 : 値2」となります。条件がtrueなら値1、falseなら値2を返します。if文と同じ意味を、よりコンパクトに表現できるのが特徴です。

let score = 75;
let result = score >= 60 ? "合格" : "不合格";
console.log(result);

合格

例えば「条件によって表示する文字を変えたい」といった場面でよく使われます。短い条件分岐であれば、if文よりもコードの見通しが良くなり、読みやすさが向上します。ただし、条件が複雑になりすぎる場合は逆に読みにくくなるため、シンプルなケースで使うのがポイントです。

let age = 18;
let message = age >= 20 ? "成人です" : "未成年です";
console.log(message);

未成年です

このように三項演算子を使うと、初心者でも少ないコードで直感的に条件分岐を書けるようになります。

2. 論理演算子で値を決定する

2. 論理演算子で値を決定する

JavaScriptでは論理演算子&&（かつ）や||（または）を使って条件式を簡単に書けます。特に||はデフォルト値を設定するのに便利です。

let userName;
let displayName = userName || "ゲスト";
console.log(displayName);

ゲスト

この書き方は、userNameがnullやundefinedの場合に、"ゲスト"を代わりに表示する便利な方法です。

3. 短絡評価で条件を省略

3. 短絡評価で条件を省略

論理演算子の特性を利用して、if文を使わずに処理を実行することもできます。これを短絡評価（ショートサーキット）と呼びます。

let isLoggedIn = true;
isLoggedIn && console.log("ログイン済みです");

ログイン済みです

条件がtrueのときだけ後ろの処理が実行されます。if文を書かなくても簡潔に表現できます。

4. switch文で複数条件を整理

4. switch文で複数条件を整理

複数の条件を分ける場合は、switch文も便利です。if文を続けて書くより見やすく整理できます。

let fruit = "リンゴ";

switch(fruit) {
  case "リンゴ":
    console.log("赤い果物です");
    break;
  case "バナナ":
    console.log("黄色い果物です");
    break;
  default:
    console.log("その他の果物です");
}

赤い果物です

defaultは、どの条件にも合致しない場合の処理です。

5. 条件式を関数にまとめて再利用

5. 条件式を関数にまとめて再利用

条件分岐の処理が何度も出てくる場合、関数にまとめると便利です。コードがすっきりし、再利用もできます。

function checkScore(score) {
  return score >= 60 ? "合格" : "不合格";
}

console.log(checkScore(70));
console.log(checkScore(50));

合格
不合格

関数にすることで、条件式のロジックを何度も書かずに済みます。

6. 条件式応用のポイント

6. 条件式応用のポイント

• 三項演算子で簡潔に条件を表現
• 論理演算子でデフォルト値や簡単な条件を設定
• 短絡評価で処理を省略して効率化
• switch文で複数条件を整理して可読性向上
• 条件式は関数にまとめて再利用性を高める

これらを活用すると、JavaScriptの条件式をより便利に、読みやすく書くことができます。初心者でも少し慣れれば、コードがスッキリして効率的になります。

この記事を読んだ人からの質問

この記事を読んだ人からの質問

プログラミング初心者からのよくある疑問／質問を解決します

JavaScriptの三項演算子とは何ですか？if文との違いも知りたいです

JavaScriptの三項演算子とは、条件式を1行で書ける便利な構文で、「条件 ? 値1 : 値2」の形式で記述します。if文は複数行になることが多いですが、三項演算子を使うとコードを短くでき、可読性も向上します。