カテゴリ: JavaScript 更新日: 2025/02/24

JavaScriptの論理演算子(&&, ||, !)を完全ガイド!初心者でもわかる基本

JavaScriptの論理演算子(&&, ||, !)
JavaScriptの論理演算子(&&, ||, !)

新人と先輩の会話形式で理解しよう

新人

「JavaScriptで、複数の条件を組み合わせて処理を実行する方法ってどうやるんですか?」

先輩

「それには、論理演算子を使います。論理演算子を使うことで、条件を組み合わせたり、反転させたりできますよ。」

新人

「論理演算子って具体的にどう使うんですか?」

先輩

「では、論理演算子を使った基本的な例を見ていきましょう!」

1. 論理演算子とは?

1. 論理演算子とは?
1. 論理演算子とは?

JavaScriptでは、論理演算子を使って複数の条件を組み合わせることができます。主な論理演算子には以下の3つがあります:

  • &&: 論理積(AND)
  • ||: 論理和(OR)
  • !: 否定(NOT)

2. 論理積(&&)

2. 論理積(&&)
2. 論理積(&&)

&&は、両方の条件が真の場合に真を返す論理積(AND)演算子です。次のコードでは、2つの条件が両方とも満たされる場合にメッセージを表示します。


<script>
    let x = 5;
    let y = 10;
    if (x > 3 && y < 15) {
        document.write("xは3より大きく、yは15より小さいです。");
    }
</script>
ブラウザ表示

このコードでは、x > 3y < 15の両方が真なので、「xは3より大きく、yは15より小さいです。」が表示されます。

3. 論理和(||)

3. 論理和(||)
3. 論理和(||)

||は、いずれかの条件が真であれば真を返す論理和(OR)演算子です。次のコードでは、いずれかの条件が満たされる場合にメッセージを表示します。


<script>
    let x = 5;
    let y = 20;
    if (x > 10 || y < 30) {
        document.write("xは10より大きいか、yは30より小さいです。");
    }
</script>
ブラウザ表示

このコードでは、x > 10は偽ですが、y < 30は真なので、「xは10より大きいか、yは30より小さいです。」が表示されます。

4. 否定(!)

4. 否定(!)
4. 否定(!)

!は、条件を反転させる否定(NOT)演算子です。条件が真なら偽に、偽なら真に変えます。

次のコードでは、xが10より小さいかどうかを確認していますが、否定演算子!を使って結果を反転させています。


<script>
    let x = 5;
    if (!(x > 10)) {
        document.write("xは10より小さいです。");
    }
</script>
ブラウザ表示

このコードでは、x > 10が偽なので、否定演算子!を使うことで条件が真に反転し、「xは10より小さいです。」が表示されます。

5. 複数の論理演算子を使う

5. 複数の論理演算子を使う
5. 複数の論理演算子を使う

複数の論理演算子を組み合わせて、さらに複雑な条件式を作ることができます。次のコードでは、&&||を組み合わせて条件を作っています。


<script>
    let x = 15;
    let y = 10;
    let z = 5;
    if ((x > 10 && y < 20) || z === 5) {
        document.write("xは10より大きく、yは20より小さいか、zは5です。");
    }
</script>
ブラウザ表示

このコードでは、x > 10y < 20の両方が真であるため、「xは10より大きく、yは20より小さいか、zは5です。」が表示されます。

コメント
コメント投稿は、ログインしてください

まだ口コミはありません。

カテゴリの一覧へ
新着記事
Java の複数の引数を扱う方法を完全ガイド!カンマで区切る基本を初心者向けに解説
Java の void メソッドとは?戻り値がない場合の使い方を初心者向けに徹底解説
Javaのメソッドのメリットを完全解説!処理の整理と再利用で初心者でも読みやすいコードに
Javaの戻り値とは?初心者でもわかるメソッドの基本と値を返す仕組み
人気記事
No.1
Java&Spring記事人気No1
SQLのINSERT文を完全ガイド!初心者でもわかるデータの追加方法
No.2
Java&Spring記事人気No2
Modelとは?メソッド引数のModelの使い方を初心者向けに解説!
No.3
Java&Spring記事人気No3
SQLのサブクエリを完全ガイド!入れ子クエリの使い方を初心者向け解説
No.4
Java&Spring記事人気No4
HTMLのセレクトボックス(プルダウン)の使い方を完全ガイド!selectとoptionの基本を覚えよう