JavaScriptの条件式で複雑な条件をまとめる書き方例

1. 複数の条件を「かつ」でまとめる（&&）

1. 複数の条件を「かつ」でまとめる（&&）

例えば、「年齢が18歳以上で、さらに会員である人だけ」を対象にしたい場合は、2つの条件をどちらも満たす必要があります。このようなときに使うのが &&（かつ）です。両方の条件が true のときだけ、全体の条件も true になります。

let age = 20;
let isMember = true;

if (age >= 18 && isMember) {
  console.log("18歳以上の会員です。");
} else {
  console.log("条件を満たしていません。");
}

このコードでは、「年齢が18歳以上」と「会員である」という2つの条件を同時にチェックしています。どちらか一方でも満たしていない場合は、条件全体が false になります。

もう少しイメージしやすくするために、初心者向けのシンプルな例も見てみましょう。

let score = 85;
let isSubmitted = true;

if (score >= 80 && isSubmitted) {
  console.log("合格です。");
} else {
  console.log("不合格です。");
}

この場合は、「点数が80点以上」かつ「課題を提出している」ことが合格の条件です。2つとも満たしていないと合格にはならない、というルールをコードで表現しています。

このように && を使うと、「すべての条件を満たす必要がある場面」をシンプルに書くことができます。条件が増えても同じように && をつなげていくだけなので、基本としてしっかり覚えておきましょう。

2. 複数の条件を「または」でまとめる（||）

2. 複数の条件を「または」でまとめる（||）

次に、「どちらか一方でも条件を満たしていればOK」という場合の書き方を見ていきましょう。JavaScriptでは、このような条件を表現するときに ||（または）を使います。複数ある条件のうち、1つでも true であれば、全体の条件も true になるのが特徴です。

let age = 16;
let hasPermission = true;

if (age >= 18 || hasPermission) {
  console.log("入場可能です。");
} else {
  console.log("入場できません。");
}

このコードでは、「18歳以上である」または「保護者の許可がある」のどちらかを満たしていれば入場できます。今回は16歳ですが、hasPermission が true のため、条件を満たしていると判断されます。

もう少し身近な例でも確認してみましょう。例えば、「土曜日または日曜日なら休み」という条件です。

let isSaturday = false;
let isSunday = true;

if (isSaturday || isSunday) {
  console.log("今日は休みです。");
} else {
  console.log("今日は平日です。");
}

このように || を使うと、「どれか1つでも当てはまればOK」という条件をシンプルに書けます。条件が増えた場合でも同じように || をつなげていくだけで表現できるため、基本としてしっかり理解しておきましょう。

3. 複雑な条件を組み合わせるときは括弧（）でグループ化

3. 複雑な条件を組み合わせるときは括弧（）でグループ化

条件が複雑になるときは、括弧を使って分かりやすくグループ分けします。JavaScriptでは、何も考えずに条件を書いてしまうと、意図しない順番で評価されてしまうことがあります。括弧を使うことで「どこを先に判定するか」をはっきりさせることができ、バグを防ぐことにもつながります。

まずはシンプルなイメージから見てみましょう。「AかつB」または「C」というように、条件のまとまりごとに分けて考えるのがポイントです。

let age = 20;
let isMember = false;
let hasInvitation = true;

// 「(年齢が18歳以上 かつ 会員)」または「招待状がある」
if ((age >= 18 && isMember) || hasInvitation) {
  console.log("入場できます。");
} else {
  console.log("入場できません。");
}

このコードでは、まず (age >= 18 && isMember) の部分がひとまとまりとして評価されます。その結果が false でも、hasInvitation が true であれば、全体としては true になります。

初心者の方は、「人間の言葉で先に整理してからコードにする」と理解しやすくなります。たとえば「会員で18歳以上の人」か「招待状を持っている人」と文章にしてから、括弧で区切って書くのがおすすめです。

このように括弧を使うことで、条件の意味がひと目で分かるようになり、あとから見直したときも理解しやすいコードになります。条件が少しでも複雑だと感じたら、必ず括弧でグループ化するクセをつけましょう。

4. 否定（!）を使って条件を逆にする

4. 否定（!）を使って条件を逆にする

条件を逆にしたいときは、否定演算子 ! を使います。これは「true を false に、false を true にひっくり返す」働きをする記号です。例えば、「会員ではない人」を判定したいときなどにとても便利です。

let isMember = false;

if (!isMember) {
  console.log("会員ではありません。");
} else {
  console.log("会員です。");
}

このコードでは、isMember が false のため、!isMember は true になります。その結果、「会員ではありません。」と表示されます。

もう少しイメージしやすいように、初心者向けの簡単な例も見てみましょう。

let isRainy = false;

if (!isRainy) {
  console.log("今日は晴れです。");
} else {
  console.log("今日は雨です。");
}

ここでは、「雨ではない場合」に晴れと判断しています。このように ! を使うと、「〜でない場合」という条件をシンプルに書くことができます。

特に、条件の名前がそのまま意味を持つ変数（例：isLogin、isActiveなど）と組み合わせると、コードが読みやすくなります。否定を使うことで、わざわざ別の変数を用意しなくても、直感的に条件を表現できるようになります。

5. 複雑な条件を分かりやすく書くコツ

5. 複雑な条件を分かりやすく書くコツ

条件式が長くなると読みにくくなるので、次のポイントを意識しましょう。特に初心者の方は「何を判定しているのか」を自分でも説明できる形にすることが大切です。

• 適度に括弧を使い、条件のまとまりをはっきりさせる
• 必要なら変数に条件の結果を入れてから判定する
• コメントで何を判定しているか説明を書く

まずはシンプルな例で、条件をそのまま書いた場合と、分かりやすく整理した場合を比べてみましょう。

// 条件をそのまま書いた例（少し読みにくい）
let age = 20;
let isMember = true;
let hasInvitation = false;

if ((age >= 18 && isMember) || hasInvitation) {
  console.log("入場可能です。");
}

この書き方でも問題ありませんが、条件が増えると一気に読みにくくなります。そこで、条件の意味ごとに変数へ分けると理解しやすくなります。

// 条件ごとに意味を持たせて変数に分ける
let age = 20;
let isMember = true;
let hasInvitation = false;

// 18歳以上かつ会員かどうか
let isAdultMember = age >= 18 && isMember;

// 入場できるかどうか
let canEnter = isAdultMember || hasInvitation;

if (canEnter) {
  console.log("入場可能です。");
} else {
  console.log("入場できません。");
}

このように分けて書くと、「何を判定しているのか」が変数名からすぐに分かります。あとから見直したときや、他の人がコードを読むときにも理解しやすくなります。

特に実務では条件がさらに増えることが多いため、「1つのif文に詰め込みすぎない」ことが重要です。少し手間でも変数に分けることで、ミスを防ぎ、バグの少ないコードを書くことができます。

6. よくある条件の組み合わせ例

6. よくある条件の組み合わせ例

ここでは、JavaScriptでよく使われる条件の組み合わせパターンを、初心者の方でも理解しやすいように具体例付きで紹介します。実務でも頻繁に登場する書き方なので、ひとつずつイメージしながら確認していきましょう。

複数の値のどれかに当てはまるか調べる

「赤・青・黄のどれかだったらOK」のように、いくつかの候補の中から一致するかを調べるときは || を使います。

let color = "青";

if (color === "赤" || color === "青" || color === "黄") {
  console.log("対象の色です。");
} else {
  console.log("対象外の色です。");
}

このように「どれか1つでも当てはまればOK」という場合は、|| をつなげて書くだけでシンプルに表現できます。

複数の条件をすべて満たすか調べる

「すべての条件をクリアしているか」を確認したい場合は && を使います。

let age = 25;
let hasLicense = true;
let isActive = true;

if (age >= 20 && hasLicense && isActive) {
  console.log("すべての条件を満たしています。");
} else {
  console.log("条件を満たしていません。");
}

この場合は、年齢・資格・状態のすべてが条件を満たしたときだけ処理が実行されます。1つでも欠けると false になる点に注意しましょう。

否定を使って条件をシンプルにする

「〜ではない場合」を表現するときは ! を使うと、無駄な比較を書かずにすみます。

let status = "会員";

if (!(status === "退会")) {
  console.log("利用可能です。");
} else {
  console.log("利用できません。");
}

この書き方は少し慣れが必要ですが、「退会でない場合」と考えると理解しやすくなります。条件が増えてきたときほど、否定をうまく使うことでコードを短く整理できます。

これらのパターンを組み合わせることで、ほとんどの条件分岐を表現できるようになります。まずはシンプルな条件から慣れていき、少しずつ複雑な条件にも挑戦していきましょう。

7. 最後に注意したいポイント

7. 最後に注意したいポイント

複雑な条件式を書くときは、論理演算子の優先順位に注意しましょう。括弧を使うと優先順位を明確にできるので、必ず使うクセをつけると良いです。

また、条件が長くなる場合は関数や変数に処理を分けて読みやすくする工夫をしましょう。

まとめ

まとめ

JavaScriptの条件式は、プログラムの流れを制御するために欠かせない重要な要素です。特に複雑な条件を扱う場面では、論理演算子であるかつまたは否定を適切に使い分けることで、柔軟で実用的な条件分岐を実現できます。今回学習した内容を振り返ると、まずかつの条件では複数の条件がすべて満たされた場合にのみ処理が実行されるため、厳密な条件チェックに適しています。一方でまたはの条件ではどれか一つでも条件を満たせばよいので、選択肢が複数ある場合に有効です。さらに否定を使うことで条件を反転させることができ、より細かい条件制御が可能になります。 また、条件式が長くなり複雑になった場合には、括弧を使ってグループ化することが重要です。これにより評価の順序が明確になり、意図しない動作を防ぐことができます。加えて、条件を変数にまとめることで可読性を高めることも実務では非常に重要なポイントです。コードは動くだけでなく、後から見たときに理解しやすいことが求められます。 実際の開発現場では、ログイン判定や権限チェック、入力値のバリデーションなど、複数条件を組み合わせるケースが非常に多くあります。そのため今回学んだJavaScriptの条件式や論理演算子の使い方は、基礎でありながら応用範囲が広い知識です。繰り返し書いて慣れることで、自然に最適な条件式を書けるようになります。 次に、理解をさらに深めるためのサンプルプログラムを確認してみましょう。

サンプルプログラムで総復習

let age = 22;
let isMember = true;
let hasCoupon = false;

// 条件を変数にまとめる
let isAdultMember = age >= 18 && isMember;
let canUseService = isAdultMember || hasCoupon;

if (canUseService) {
  console.log("サービスを利用できます。");
} else {
  console.log("サービスを利用できません。");
}

実行結果

サービスを利用できます。

このように条件を段階的に整理していくことで、複雑な条件式でも見やすく理解しやすいコードを書くことができます。特に初心者のうちは一つの条件にまとめようとせず、小さく分けて考えることが上達の近道です。 JavaScriptの条件分岐は基礎文法の中でも頻繁に使用されるため、繰り返し練習しながら自分のものにしていきましょう。条件式の書き方を理解すると、プログラム全体の構造が見えてくるようになります。