これまで、変数やデータを扱ってきましたが、
次のステップでは「その値をどう判断するのか?」が重要になってきます。
たとえば――
「この数値は正しいのか?」
「この値は条件を満たしているのか?」
プログラムは、このような問いに対して常に判断を行いながら動いています。
では、JavaScriptはどんな基準で判断しているのでしょうか?
今回は、その 判定のルール を基本から整理していきましょう!
JavaScriptの「真」と「偽」
プログラミングの世界では、すべての判断が次の2つに分かれます。
- true(真) … 条件が成り立っている状態
- false(偽) … 条件が成り立っていない状態
たとえば「ログインしているかどうか」を表すなら、次のように書けます。
const isLoggedIn = true; // ログインしている
const isError = false; // エラーは発生していない
ここでは、
isLoggedInという変数に「ログインしている」という状態をisErrorという変数に「エラーがない」という状態を
それぞれ示しています。
このように、true(真) / false(偽) は
「状態」を表すための値としてよく使われます。
比較演算子とは?
値が「true(真)」か「false(偽)」かを判断するために使うのが、比較演算子です。
JavaScriptでよく使う比較演算子は、次のとおりです。
まずは一覧で全体像を確認してみましょう。
| 演算子 | 意味 | サンプルコード |
|---|---|---|
> | より大きい | 5 > 3 |
< | より小さい | 5 < 3 |
>= | 以上 | 5 >= 5 |
<= | 以下 | 5 <= 5 |
== | 等しい(型を自動変換して比較) | 2 == "2" |
=== | 厳密に等しい(値も型も同じ) | 2 === "2" |
!= | 等しくない(型を自動変換して比較) | 5 != "5" |
!== | 厳密に等しくない | 5 !== "5" |
たとえば、
console.log(5 > 3); // true
console.log(5 < 3); // false
「5は3より大きいか?」という問いに対して、
結果が true / false で返ってきます。
== と === の違い
特に注意したいのがこの2つ、== と === 。
const num = 10;
const strNum = "10";
console.log(num == strNum); // true
console.log(num === strNum); // false
==は、型を自動で変換して比較します===は、値も型も完全に同じ場合だけ true になります
10(数値)と "10"(文字列)は、
見た目は同じでも「型」が違います。
そのため、通常は === を使うのが基本 です。
意図しない自動変換を防ぐことができます!
Truthy と Falsy
ここからが、JavaScript特有の少しややこしい部分です。
JavaScriptでは、true や false という値でなくても、
条件を評価する場面では、自動的に「真」か「偽」に変換されます。
たとえば、数値や文字列、配列なども、
条件の中で使われた瞬間に true / false のどちらかとして判断されます。
つまり、値そのものが true や false でなくても、
判定の場面では「真」か「偽」に置き換えられているのです。
このとき、
条件の中で「真」として扱われる値を Truthy(トゥルーシー)
「偽」として扱われる値を Falsy(フォールシー)
と呼びます。
Falsy と判定される値
JavaScriptで「偽」として扱われる値は、次の6つです。
false0""(空文字)nullundefinedNaN
これらは、
値がない・空である・意味を持たない 状態を表すものとして扱われます。
それ以外の値は、すべて Truthy(真扱い)になります。
たとえば、
"0"(文字列の0)[](空の配列){}(空のオブジェクト)
これらはすべて Truthy と扱われます。
0 は数値ですが、条件の中では「偽」として扱われます!
「値が入っている」という意味で使っていても、
判定の場面では成立していないと解釈されるので注意しましょう💦
論理演算子の基本
次に、複数の条件を組み合わせるための方法を見てみましょう。
1つの条件だけでなく、
「Aも満たす」「BまたはCを満たす」といった
複数の条件を扱いたい場面もあります。
そのときに使うのが、論理演算子です。よく使うのは次の3つ。
&&(AND)
2つの条件がどちらも true のときだけ、結果が true になります。
どちらか一方でも false が含まれていると、結果は false になります。
console.log(true && true); // true
console.log(true && false); // false
||(OR)
2つの条件のうち、どちらか一方でも true であれば、結果は true になります。
両方とも false の場合だけ false になります。
console.log(true || false); // true
console.log(false || false); // false
!(NOT)
true を false に、false を true に反転させます。
すでにある結果を「逆の意味」にしたいときに使います。
console.log(!true); // false
console.log(!false); // true
まずは、それぞれの演算子が「どのような条件のときに true になるのか」を理解することが大切です!
まとめ
ここまで、JavaScriptの「判定の仕組み」を見てきました。
\\ 今回のまとめ //
・ true は「条件が成り立つ状態」
・ false は「条件が成り立たない状態」
・ 比較演算子で真偽を判断する
・ === を使うのが基本
・ Falsy は6つだけ(0も含まれる)
・ 論理演算子は条件を組み合わせるための記号
特別なテクニックではありませんが、
この判定ルールを理解しているかどうかで、
コードの読みやすさ・書きやすさは大きく変わります。
JavaScriptが「どう考えているのか」を知ること。
それが、自在にコードを書けるようになる第一歩です。


コメント