【JavaScript入門】真偽値（Boolean）

このページで解説している内容は、以下の YouTube 動画の解説で見ることができます。

真偽値（Boolean）

　プログラムでは「条件を満たすか・満たさないか」を判定する場面が多くありますが、このときに活躍するのが「真偽値（Boolean型）」です。真偽値は true と false の2種類のみで表され、JavaScript においては Boolean 型に分類されます。ここでは、真偽値を返すさまざまな演算子や、値がどのように真偽とみなされるかを解説します。

１．真偽値とは

真偽値 (Boolean) は、true か false のどちらかを表す型です。
日常ではあまり意識しませんが、プログラムでは条件分岐（if文など）と組み合わせて頻繁に使われます。

２．真偽値を返す演算子

2.1. 否定演算子 `!`

値を真偽値として解釈し、その結果を反転する演算子です。

console.log(!true);  // false
console.log(!false); // true

2.2. 等価・同値演算子

　左右の値が「同じかどうか」を判定します。JavaScript では4種類あり、それぞれ厳密度が異なります。

演算子	説明
`==`	等価演算子 : 型をまたいで「同じとみなせる」なら `true`
`!=`	不等価演算子 : 型をまたいで「違うとみなせる」なら `true`
`===`	同値演算子 : 型も値も同じなら `true`
`!==`	非同値演算子 : 型か値が異なるなら `true`

==/!= は型変換を行って比較するため、'1' == 1 は true になりますが、一方 ===/!== は厳密に型も比較するため、'1' === 1 は false です。
基本的にエラーや混乱を避けるため「===」と「!==」を使う方が安全です。

2.3. 比較演算子

　左右の値の大小を判定します。大小だけでなく「同じかもしれない」演算子 (<=, >=) も含まれます。

演算子	説明
`<`	左辺が右辺より小さい場合は `true`
`>`	左辺が右辺より大きい場合は `true`
`<=`	左辺が右辺より小さいか、または同じなら `true`
`>=`	左辺が右辺より大きいか、または同じなら `true`

　この演算子は、文字列同士の比較も可能です。文字列の場合は辞書順で比較し、「cat < dog」のような形で判定します。

2.4. 論理演算子 (`&&` と `||`)

論理演算子は、複数の条件を組み合わせる際に使用します。

演算子	説明
`&&`	論理積 (AND) : 両方の条件が `true` のときだけ `true`
`\|\|`	論理和 (OR) : どちらかが `true` であれば `true`

　例えば「予算が1000円以内」かつ「野菜メニューがある」という条件を両方満たすなら true にしたい場合は && を使います。「チョコレートケーキがある」または「ソフトクリームがある」なら true にしたい場合は || を使います。

３．真偽値として扱われる値

　JavaScript では、数値・文字列などの値も「条件式」で用いられるときに true または false とみなされます。特に以下の値は false とみなされ、それ以外は true となります。

種類	`false` とみなすもの	`true` とみなすもの
特殊な値	`undefined`, `null`	－
数値	`0`, `NaN`	0 以外の数値
文字列	`''` (空文字)	それ以外の文字列
配列（Array）	`[]`（要素が空の場合）	要素が1つ以上ある場合
オブジェクト	`{}`（プロパティなしの場合）	プロパティが1つ以上ある場合

４．サンプルHTML: 真偽値や演算子の例

　ファイル名を「myBooleanSample.html」として、ブラウザで開き、開発者ツール（コンソール）をチェックしてみてください。

【myBooleanSample.html】

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="utf-8">
  <title>myBooleanSample.html</title>
</head>
<body>
  <h1>真偽値のサンプル</h1>
  <p>ブラウザの開発者ツール(コンソール)を開いて結果を確認してください。</p>
  <script>
    // 1. 否定演算子
    console.log("!true =", !true);    // false
    console.log("!false =", !false);  // true

    // 2. 等価・同値演算子
    console.log("'2' == 2 =", ('2' == 2));   // true (型をまたいで比較)
    console.log("'2' === 2 =", ('2' === 2)); // false (型も比較)
    console.log("null == undefined =", (null == undefined));   // true
    console.log("null === undefined =", (null === undefined)); // false

    // 3. 比較演算子
    console.log("3 < 5 =", (3 < 5));    // true
    console.log("3 <= 3 =", (3 <= 3));  // true
    console.log("'apple' < 'banana' =", ('apple' < 'banana')); // true (辞書順)

    // 4. 論理演算子
    console.log("true && false =", (true && false));  // false
    console.log("true || false =", (true || false));  // true

    // 5. 真偽値として扱われる例
    if (0) {
      console.log("0はtrue"); 
    } else {
      console.log("0はfalseとみなされる"); // こちらが表示される
    }

    if ('Hello') {
      console.log("'Hello' は true"); // こちらが表示される
    }
  </script>
</body>
</html>

実行結果

デバッグコンソールの出力

!true = false
!false = true
'2' == 2 = true
'2' === 2 = false
null == undefined = true
null === undefined = false
3 < 5 = true
3 <= 3 = true
'apple' < 'banana' = true
true && false = false
true || false = true
0はfalseとみなされる
'Hello' は true

まとめ

JavaScript の真偽値は true と false の2種類のみで、Boolean 型に属する。
比較演算子や論理演算子を使うことで、数値や文字列、オブジェクトが条件を満たすかを判定できる。
特定の値（0, '', null, undefined, NaN など）は条件式で false とみなされるため、条件分岐などでよく活用される。
「==」など型を変換して比較する演算子は思わぬバグを引き起こす可能性があるため、可能な限り「===」による厳密比較を使うのが望ましい。

　こうして、どのように真偽値を判定し、どのような値が true / false とみなされるかを理解しておくと、条件分岐をはじめとする制御構文を正確に書けるようになります。

【JavaScript入門】真偽値（Boolean）