JavaScript | 基礎構文:比較・論理 – 論理 AND

JavaScript JavaScript
スポンサーリンク

論理 AND を一言でいうと

論理 AND(アンド)は、
「条件 A も条件 B も、どちらも満たされているときだけ OK(true)にする」ための演算子 です。

記号は &&(アンパサンド2つ)を使います。

「A かつ B」
「A も B も」

という日本語とセットで覚えてください。

ここが重要です。
論理 AND は「複数の条件をまとめてチェックする」ための基本パーツ です。
if 文で「○○で、なおかつ△△のとき」という条件を書くときに、必ず顔を出します。


一番シンプルな使い方:true / false 同士の AND

AND の真理値表(本質のルール)

本質的なルールはとても単純です。

条件 A と条件 B があったとき:

  • A も B も true → 結果は true
  • どちらか一方でも false → 結果は false

コードで見てみます。

console.log(true  && true);   // true
console.log(true  && false);  // false
console.log(false && true);   // false
console.log(false && false);  // false
JavaScript

「全部 OK なら OK」「1つでもダメならダメ」
これが論理 AND です。

if 文での基本パターン

例えば、「年齢が 20 以上 かつ 日本在住なら OK」という条件。

const age = 25;
const country = "Japan";

if (age >= 20 && country === "Japan") {
  console.log("条件を満たしています");
}
JavaScript

age >= 20 が true
country === "Japan" も true
なので、true && true → 全体として true です。

どちらか一つでも条件を満たしていなければ、
if の中には入りません。

ここが重要です。
論理 AND は「チェックを追加する」イメージです。
「年齢が 20 以上【で】、さらに国が Japan で」というふうに、
条件を重ねるときに && が生きてきます。


実用イメージ:複数条件をまとめて書く

範囲チェック(○以上 △以下)

例えば、「点数が 70 点以上 かつ 90 点以下」を判定したいとします。

const score = 85;

if (score >= 70 && score <= 90) {
  console.log("70〜90 の範囲内です");
}
JavaScript

score >= 70score <= 90 の両方が true のときだけ、
全体として true になります。

数学の不等式で「70 <= score <= 90」と書く感じを、
JavaScript では 70 <= score && score <= 90 のように
「2 つの比較式+論理 AND」で表現します。

ログイン条件など「2 つ以上の前提」が必要な場面

例えば、「ログインしていて、かつ管理者フラグが立っている」という条件。

const isLoggedIn = true;
const isAdmin = false;

if (isLoggedIn && isAdmin) {
  console.log("管理者ページにアクセスできます");
}
JavaScript

isLoggedIn が true
isAdmin は false

なので、true && false → 全体として false。
条件を満たしていないので、if の中は実行されません。

ここが重要です。
「A だけでは足りない」「A も B も必要」という場面では、
条件を && でつないでいく、という思考パターンを身につけてください。
これが条件式設計の基本形の一つです。


ちょっと深掘り:JavaScript 特有の「短絡評価(ショートサーキット)」

左側が false なら、右側は評価されない

論理 AND && には、
「左側が false だったら、その時点で結果は false 確定なので、右側は評価しない」
という性質があります。

これを「短絡評価(ショートサーキット)」と呼びます。

function sayHello() {
  console.log("Hello が実行された");
  return true;
}

console.log(false && sayHello()); // false
JavaScript

この場合、false && ... の時点で結果は絶対に false なので、
sayHello() はそもそも呼ばれません(ログも出ません)。

「◯◯かつ ××」のとき、「◯◯がそもそもダメなら××は調べない」

もう一つ、典型的なパターン。

const user = null;

// user が存在していて、かつ user.isAdmin が true
if (user && user.isAdmin) {
  console.log("管理者です");
}
JavaScript

ここで user が null の状態で、
もし if (user.isAdmin) とだけ書くとエラーになります。

しかし、user && user.isAdmin の場合、

  • まず user を評価(null → false とみなされる)
  • 左側が false なので、右側 user.isAdmin は評価されない

結果、エラーにならず if 全体が false になります。

ここが重要です。
短絡評価は、「左側のチェックで落ちたら右側を見ない」という安全装置にもなります。
「値が存在しているか?」を左に、「その値のプロパティチェック」を右に置く、という書き方は非常によく使われるパターンです。


さらに深掘り:&& の戻り値は「true / false」だけではない

JavaScript の && は「左か右のどちらかの値そのもの」を返す

JavaScript の && は、
単純に true / false を返すだけではありません。

ルールはこうです。

  • 左側が「偽っぽい値」(falsy)なら、左側の値をそのまま返す
  • 左側が「真っぽい値」(truthy)なら、右側の値を返す
console.log(true  && "OK");   // "OK"
console.log(false && "OK");   // false

console.log("hello" && 123);  // 123  ("hello" は truthy なので右側)
console.log("" && 123);       // ""   (空文字は falsy なので左側)
JavaScript

「truthy / falsy」というのは、
if 文などで「真っぽい」「偽っぽい」と判定される値のことです。

falsy には主に

  • false
  • 0
  • ""(空文字)
  • null
  • undefined
  • NaN

などがあります。
それ以外の値はだいたい truthy です。

これを利用した「条件付きの代入」や「ガード」

例えば、「設定オブジェクトがあれば、その中の値を使いたい」というとき。

const config = { debug: true };

const debugEnabled = config && config.debug;
console.log(debugEnabled); // true
JavaScript

config が null や undefined のときは、
config && config.debug は左側の falsy を返します。

つまり、debugEnabled には

  • config があれば → config.debug の値
  • config がなければ → null / undefined のまま

という挙動になります。

ここが重要です。
&& は true / false だけを返す」と思い込むと、JavaScript ではハマります。
「左が falsy なら左、truthy なら右」を返す、という仕様を知っておくと、
条件付き評価や「安全なプロパティアクセス」にかなり応用が効くようになります。


論理 AND と組み合わせて考えるべきポイント

AND で条件を増やすと「狭く」なる

const age = 25;
const country = "Japan";

const cond1 = age >= 20;                       // 20歳以上
const cond2 = country === "Japan";             // 日本在住
const condAll = cond1 && cond2;                // 両方満たす

console.log(cond1);   // true
console.log(cond2);   // true
console.log(condAll); // true
JavaScript

今ある条件に && でもう一つ条件を足していくと、
「これも満たして、さらにこれも」というふうに、
条件は厳しく(範囲は狭く)なります。

逆に、条件を緩くしたいときは ||(論理 OR) を使います。
(OR はまた別テーマですね)

複雑になってきたら条件を分解する

悪い例をあえて書きます。

if (user && user.age >= 20 && user.country === "Japan" && !user.blocked) {
  // ...
}
JavaScript

これでも動きますが、一行で全部書いてしまうと読みづらいです。

少し分解すると、ずっと読みやすくなります。

const isAdult       = user && user.age >= 20;
const isInJapan     = user && user.country === "Japan";
const isNotBlocked  = user && !user.blocked;

if (isAdult && isInJapan && isNotBlocked) {
  // ...
}
JavaScript

ここまでやるべきかどうかはケースによりますが、
「論理 AND を使うときは、“条件の名前” をつけてあげられるか」を意識する と、
自然と読みやすいコードに寄っていきます。

ここが重要です。
&& は「条件を詰め込むためのゴミ箱」ではありません。
「名前を付けられる意味のある条件」を組み合わせていくパーツだと考えると、
コードの意図が自分にも他人にも伝わりやすくなります。


初心者として論理 AND で本当に押さえてほしいこと

A && B は、「A も B も true のときだけ true」。
どちらか一方でも false なら全体は false。

「年齢が 20 以上【で】日本在住」のように、
「〜かつ〜」という日本語が頭に浮かぶ場面で使う。

&& には「短絡評価」があり、
左側が false(falsy)なら右側は評価されない。
これを利用して「存在チェック → プロパティアクセス」の安全な書き方ができる。

JavaScript の && は、結果として true / false だけでなく、
左または右の値そのものを返す。
「左が falsy なら左、truthy なら右」という性質を知っておくと応用が利く。

ここが重要です。
論理 AND は、「条件を足していく道具」です。
「この条件だけじゃ足りないよな」「もう一つ条件をくっつけたいな」と思ったら、
頭の中で日本語の「〜かつ〜」を唱えてから、&& で条件をつなぐ。
その小さな習慣が、読みやすくて意図がはっきりした条件式につながっていきます。

最後に、小さな練習を一つ置いておきます。
結果を予想してから実行してみてください。

console.log(true  && true);
console.log(true  && false);
console.log(false && true);
console.log(false && false);

console.log(0 && "hello");
console.log(1 && "hello");
console.log("" && 123);
console.log("abc" && 123);

const user = null;
if (user && user.name) {
  console.log("これは表示される?されない?");
}
JavaScript

「なぜそうなるのか」を、自分の言葉で説明できるようになったとき、
論理 AND はもうあなたの道具になっています。

タイトルとURLをコピーしました