カテゴリ: JavaScript 更新日: 2026/07/09

JavaScriptの条件式で論理演算子(&&, ||, !)を活用する方法!初心者でもわかる使い方ガイド

JavaScriptの条件式で論理演算子(&&, ||, !)を活用する方法
JavaScriptの条件式で論理演算子(&&, ||, !)を活用する方法

先生と生徒の会話形式で理解しよう

生徒

「先生、JavaScriptの条件で複数の条件をまとめてチェックしたいんですが、どうすればいいですか?」

先生

「そういうときは論理演算子を使います。『&&(AND)』『||(OR)』『!(NOT)』の3つがありますよ。」

生徒

「それぞれどういう意味で、どう使うんですか?」

先生

「順番にわかりやすく説明しますね!」

1. 論理演算子とは?複数の条件をまとめて判定するための記号

1. 論理演算子とは?複数の条件をまとめて判定するための記号
1. 論理演算子とは?複数の条件をまとめて判定するための記号

論理演算子は、複数の条件を組み合わせて「すべて満たすか」「どれか満たすか」「条件を反転するか」などを判定するときに使います。条件を1つずつ書くのではなく、まとめて評価できるため、コードをシンプルに書けるのが特徴です。

「条件式」はプログラムで「もし〇〇だったら…」と処理を分けるときの大切な部分です。論理演算子を使うことで、より実用的で柔軟な条件分岐ができるようになります。

たとえば、「テストの点数が80点以上で、かつ出席している場合だけ合格」といったように、複数の条件を同時にチェックする場面でよく使われます。


let score = 85;
let isPresent = true;

if (score >= 80 && isPresent) {
  console.log("合格です!");
}

この例では、「点数が80点以上」かつ「出席している」の両方を満たした場合にだけ、「合格です!」と表示されます。


合格です!

このように論理演算子を使うことで、複数の条件をまとめて判断できるため、実際のアプリ開発やWeb制作でも頻繁に使われる重要な基本知識となります。

2. AND演算子(&&)の使い方

2. AND演算子(&&)の使い方
2. AND演算子(&&)の使い方

AND演算子は「かつ」と読みます。複数の条件すべてが真(true)だったときだけ、結果が真になります。1つでも条件が満たされていない場合は、結果は偽(false)になります。

例えるなら、「今日は晴れている」かつ「気温が20度以上」でないと外出しない、という場合です。このように「両方の条件を満たす必要がある」ときに使います。


let isSunny = true;
let temperature = 22;

if (isSunny && temperature >= 20) {
  console.log("外出しましょう!");
} else {
  console.log("今日は外出を控えましょう。");
}

ここでは isSunnytrue かつ temperature が20以上のときだけ「外出しましょう!」と表示されます。どちらか一方でも条件を満たさない場合は、外出しないという判断になります。


外出しましょう!

AND演算子は、ログインチェックや入力内容の確認など、複数の条件を同時に満たす必要がある場面でよく使われます。最初は「すべて満たす必要がある条件」と覚えておくと理解しやすいです。

3. OR演算子(||)の使い方

3. OR演算子(||)の使い方
3. OR演算子(||)の使い方

OR演算子は「または」と読みます。複数の条件のうち、どれか1つでも真なら結果が真になります。

たとえば、「今日は雨が降る」または「風が強い」なら傘を持っていく、という場合です。


let isRainy = true;
let isWindy = false;

if (isRainy || isWindy) {
  console.log("傘を持っていきましょう。");
} else {
  console.log("傘は必要ありません。");
}

この例では、isRainyisWindyのどちらか一方でもtrueであれば、条件が成立します。両方ともfalseの場合だけ、elseの処理が実行されます。


傘を持っていきましょう。

OR演算子は、「どれか1つでも当てはまればOK」という場面でよく使われます。例えば、ログイン時に「メールアドレスまたはユーザー名が一致しているか」をチェックする場合などです。複数の選択肢の中から条件に合うものを探すときに便利なので、基本の使い方としてしっかり押さえておきましょう。

4. NOT演算子(!)の使い方

4. NOT演算子(!)の使い方
4. NOT演算子(!)の使い方

NOT演算子は「〜でない」と読みます。条件の真偽を逆にする役割があり、trueならfalseに、falseならtrueに変えるのが特徴です。

例えば、「雨が降っていないときに外出する」といったように、特定の条件を否定したいときに使います。プログラムでは「〜ではない場合の処理」を書く場面が多いため、NOT演算子はとてもよく使われます。


let isRainy = false;

if (!isRainy) {
  console.log("今日は外に出かけましょう!");
}

この例では、isRainyfalseのときに、!isRainytrueになるため、「今日は外に出かけましょう!」と表示されます。


今日は外に出かけましょう!

また、NOT演算子は入力チェックでも役立ちます。例えば「名前が入力されていない場合」を調べるときにも使えます。


let userName = "";

if (!userName) {
  console.log("名前を入力してください。");
}

このように、値が空だったり未入力の場合もfalseとして扱われるため、!を使うことでシンプルに条件を書くことができます。NOT演算子は「条件をひっくり返す」と覚えておくと、初心者でも直感的に使えるようになります。

5. 複数の論理演算子を組み合わせる

5. 複数の論理演算子を組み合わせる
5. 複数の論理演算子を組み合わせる

論理演算子は組み合わせて使えます。例えば、「晴れているかつ気温が20度以上、または雨が降っていない」など複雑な条件を作れます。


if ((isSunny && temperature >= 20) || !isRainy) {
  console.log("外に出かけても良さそうです。");
}

かっこを使うことで、どの条件を先に判断するかをはっきりさせます。これを「優先順位」と言います。

6. 実際の生活に例えて理解しよう

6. 実際の生活に例えて理解しよう
6. 実際の生活に例えて理解しよう

論理演算子は「複数の条件を組み合わせる」ための便利な道具です。たとえば、料理のレシピで「材料がすべて揃っている」なら調理開始、または「特別な材料がある」なら代わりに使う、といった感じです。

このように、プログラムでも色々な条件を組み合わせて細かく処理を分けられます。

7. 論理演算子を使うときの注意点

7. 論理演算子を使うときの注意点
7. 論理演算子を使うときの注意点
  • 優先順位に気をつける
    論理演算子は順番によって結果が変わることがあるため、かっこを使って明確にしましょう。
  • 真(true)と偽(false)を理解する
    論理演算子は真偽値を扱うため、条件式が何を返すかを意識することが大事です。
  • 複雑すぎる条件は分けて書く
    コードが見にくくなる場合は、一つずつ条件を分けて書くとわかりやすいです。

8. よくある間違いと解決方法

8. よくある間違いと解決方法
8. よくある間違いと解決方法

例えば、!を使うときに「!isRainy == true」と書く人がいますが、これは不要です。!isRainyだけで十分です。

また、条件が複雑になったら途中でconsole.log()を使って結果を確認するのもおすすめです。

まとめ

まとめ
まとめ

今回はJavaScriptにおける論理演算子について、基礎から応用までしっかりと整理してきました。論理演算子はプログラミングにおいて非常に重要な役割を持っており、条件分岐や制御構造を正しく理解するうえで欠かせない知識です。特に初心者の方にとっては、if文と組み合わせて使う場面が多いため、確実に理解しておくことでコードの読解力と記述力の両方が大きく向上します。

まずAND演算子は、複数の条件がすべて満たされているかどうかを確認するために使用します。つまり一つでも条件が満たされていない場合は結果が偽になるという特徴があります。この考え方はログイン認証や入力チェックなどの実務でも頻繁に登場します。たとえばユーザー名とパスワードの両方が正しい場合のみ処理を進めるといった場面では、AND演算子の理解が不可欠です。

次にOR演算子は、複数の条件のうちどれか一つでも満たされていれば真となる性質を持っています。この演算子は柔軟な条件分岐を実現するために非常に便利で、たとえばエラー処理や入力の許容範囲を広げるときなどに役立ちます。複数のパターンを許可するような処理では、OR演算子を適切に使うことでコードを簡潔に保つことができます。

さらにNOT演算子は条件の真偽を反転させる役割を持っています。条件を否定することでコードの意図を明確にすることができ、特に条件が複雑になったときに読みやすさを保つために重要です。例えば「ログインしていない場合のみ表示する」といった処理ではNOT演算子が非常に有効です。

また、これらの論理演算子は単体で使うだけでなく、組み合わせて使うことでより複雑な条件式を作ることができます。その際に重要になるのが優先順位の理解です。かっこを使って評価の順番を明確にすることで、意図しない動作を防ぐことができます。プログラムは見た目以上に厳密に評価されるため、曖昧な書き方はバグの原因になります。

実際の開発現場では、条件式が長くなりすぎることも少なくありません。そのような場合は、変数に一度結果を代入するなどして処理を分けることで、コードの可読性を高めることができます。読みやすいコードを書くことは、後から自分自身が見直すときにも、他の開発者と共有するときにも大きなメリットになります。

さらに重要なポイントとして、trueとfalseの概念をしっかり理解しておくことが挙げられます。JavaScriptでは条件式の評価結果が真偽値として扱われるため、どのような場合にtrueになるのか、どのような場合にfalseになるのかを正確に把握することが必要です。これを理解していないと、思わぬバグにつながる可能性があります。

最後に、学習を進めるうえで大切なのは実際に手を動かして試してみることです。console.logを使って結果を確認しながら、さまざまな条件式を自分で書いてみることで理解が深まります。論理演算子は最初は難しく感じるかもしれませんが、繰り返し使うことで自然と身についていきます。

サンプルプログラムで振り返る


const isMember = true;
const age = 25;
const hasCoupon = false;

if ((isMember && age >= 20) || hasCoupon) {
  console.log("割引が適用されます。");
} else {
  console.log("通常料金です。");
}

実行結果


割引が適用されます。

上記のように、複数の条件を組み合わせることで現実的な処理を実装することができます。このようなコードを書くことで、実務に近い形で論理演算子の使い方を理解することができます。

先生と生徒の振り返り会話

生徒

「論理演算子って最初は難しく感じましたけど、意味が分かるとすごく便利ですね。」

先生

「その通りです。条件を自由に組み合わせられるようになると、できることが一気に増えますよ。」

生徒

「ANDとORとNOTの違いもだいぶ整理できました。特にかっこを使う重要性がよく分かりました。」

先生

「いいですね。優先順位を意識することはとても大切です。バグを防ぐためにも習慣にしましょう。」

生徒

「これからは自分で条件式を書いて試しながら理解を深めていきます。」

先生

「それが一番の近道です。繰り返し使っていけば、自然と身についていきますよ。」

カテゴリの一覧へ
新着記事
New1
JavaScript
JavaScriptでURLを正規化(canonical)する方法を徹底解説!初心者向けにわかりやすく解説
New2
TypeScript
TypeScriptの型まとめ!安全で保守性の高いコードを書く方法
New3
TypeScript
TypeScriptのプロジェクトをtscでビルドする基本操作を解説!初心者にもわかるステップバイステップ
New4
Claude Code
Claude Codeの基本的な使い方!起動から終了まで初心者向けに解説
人気記事
No.1
Java&Spring記事人気No1
TypeScript
TypeScript学習におすすめの無料教材・リファレンスサイト【初心者向け】
No.2
Java&Spring記事人気No2
JavaScript
JavaScriptのインストール方法まとめ!Windows・Mac・Linux別にステップ解説
No.3
Java&Spring記事人気No3
JavaScript
JavaScriptの文字列を分割する方法(splitメソッド)
No.4
Java&Spring記事人気No4
JavaScript
JavaScriptで要素の表示・非表示を切り替える方法(display・visibility)を完全解説
No.5
Java&Spring記事人気No5
TypeScript
TypeScriptで最初に覚えたい基本構文まとめ
No.6
Java&Spring記事人気No6
JavaScript
JavaScriptでフォームの値を取得する方法を徹底解説!valueプロパティの使い道
No.7
Java&Spring記事人気No7
JavaScript
JavaScriptのライブラリとは?標準ライブラリと外部ライブラリの違いと使い方
No.8
Java&Spring記事人気No8
TypeScript
TypeScriptでクライアントとサーバーのバリデーションを共通化する方法!初心者向けデータ検証入門