JavaScriptの論理演算子(&&, ||, !)を完全ガイド!初心者でもわかる基本
新人
「JavaScriptで、複数の条件を組み合わせて処理を実行する方法ってどうやるんですか?」
先輩
「それには、論理演算子を使います。論理演算子を使うことで、条件を組み合わせたり、反転させたりできますよ。」
新人
「論理演算子って具体的にどう使うんですか?」
先輩
「では、論理演算子を使った基本的な例を見ていきましょう!」
1. 論理演算子とは?
JavaScriptでは、論理演算子を使って複数の条件を組み合わせることができます。主な論理演算子には以下の3つがあります:
&&: 論理積(AND)||: 論理和(OR)!: 否定(NOT)
2. 論理積(&&)
&&は、両方の条件が真の場合に真を返す論理積(AND)演算子です。次のコードでは、2つの条件が両方とも満たされる場合にメッセージを表示します。
<script>
let x = 5;
let y = 10;
if (x > 3 && y < 15) {
document.write("xは3より大きく、yは15より小さいです。");
}
</script>
ブラウザ表示
このコードでは、x > 3とy < 15の両方が真なので、「xは3より大きく、yは15より小さいです。」が表示されます。
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. 否定(!)
!は、条件を反転させる否定(NOT)演算子です。条件が真なら偽に、偽なら真に変えます。
次のコードでは、xが10より小さいかどうかを確認していますが、否定演算子!を使って結果を反転させています。
<script>
let x = 5;
if (!(x > 10)) {
document.write("xは10より小さいです。");
}
</script>
ブラウザ表示
このコードでは、x > 10が偽なので、否定演算子!を使うことで条件が真に反転し、「xは10より小さいです。」が表示されます。
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 > 10とy < 20の両方が真であるため、「xは10より大きく、yは20より小さいか、zは5です。」が表示されます。