JavaScript - 比較演算子

こんにちは、未来のJavaScript魔法使いさんたち!今日は、比較演算子の不思議な世界に飛び込みます。コードを書いたことがない人も心配しないでください - このエキサイティングな旅であなたの親切なガイドになるんです。那么、キーボード(つまり魔法の杖)を手に取り、始めましょう!

JavaScript - Comparison Operators

JavaScript 比較演算子

比較演算子はプログラミング世界の裁判官のようなものです。2つの値を見て、それらがどのように関連しているかを判断します。等しいですか?片方がもう片方より大きいですか?これらの演算子は、私たちが実際の生活で判断を下すのと同じように、コード内で判断を下すのに役立ちます。

今日取り上げる比較演算子を見てみましょう:

演算子 名前
== 等価 x == y
!= 不等価 x != y
=== 厳密な等価 x === y
!== 厳密な不等価 x !== y
> 大なり x > y
>= 大なりまたは等しい x >= y
< 小なり x < y
<= 小なりまたは等しい x <= y

比較の方法

各演算子を見る前に、JavaScriptが値を比較する方法を理解しましょう。実際の物を比較するのとあまり変わらないです!

  1. 数値を比較する場合は簡単です。JavaScriptはどちらの数が大きいかをチェックします。
  2. 文字列の場合、JavaScriptは文字列のUnicode値に基づいて文字ずつ比較します。
  3. 異なる型(例えば数値と文字列)を比較する場合は、JavaScriptは通常、片方を他方の型に変換してから比較します。

では、各演算子を詳しく見ていきましょう。

JavaScript 等価(==)演算子

等価演算子(==)は、2つの値が等しいかどうかをチェックしますが、少し柔軟です。型を変換してから比較します。例を見てみましょう:

console.log(5 == 5);     // true
console.log(5 == "5");   // true
console.log(true == 1);  // true
console.log(null == undefined);  // true

最初の例では、結果がtrueであることは明確です。2番目の例では、JavaScriptは文字列"5"を数値に変換してから比較します。3番目の例は驚きかもしれません - JavaScriptはtrueを1、falseを0と見なします。最後の例では、nullundefinedは==演算子では等しいと見なされます。

JavaScript 不等価(!=)演算子

不等価演算子(!=)は、==の逆向きです。2つの値が等しくないかどうかをチェックします。

console.log(5 != 6);     // true
console.log(5 != "5");   // false
console.log(true != 1);  // false

==と同様に、型変換を行ってから比較します。

JavaScript 厳密な等価(===)演算子

さて、厳密な等価演算子(===)に encounter しましょう。この演算子は、==演算子の厳しい兄貴分のようなものです。値だけでなく、型も同じかどうかを確認します。

console.log(5 === 5);     // true
console.log(5 === "5");   // false
console.log(true === 1);  // false
console.log(null === undefined);  // false

==との結果が異なるのがわかりますか?厳密な等価演算子は型変換を行いません。

厳密な不等価(!==)演算子

厳密な不等価演算子(!==)は、===の逆向きです。値も型も異なるかどうかをチェックします。

console.log(5 !== 6);     // true
console.log(5 !== "5");   // true
console.log(true !== 1);  // true

JavaScript 大なり(>)演算子

大なり演算子(>)は、左側の値が右側の値よりも大きいかどうかをチェックします。

console.log(10 > 5);   // true
console.log(5 > 10);   // false
console.log(10 > 10);  // false
console.log("b" > "a");  // true (Unicode値に基づいて比較)

文字列を比較する場合、Unicode値に基づいて比較されることを覚えておきましょう。アルファベットの順序ではありません!

大なりまたは等しい(>=)演算子

大なりまたは等しい演算子(>=)は、左側の値が右側の値よりも大きいか等しいかどうかをチェックします。

console.log(10 >= 5);   // true
console.log(10 >= 10);  // true
console.log(5 >= 10);   // false

JavaScript 小なり(<)演算子

小なり演算子(<)は、左側の値が右側の値よりも小さいかどうかをチェックします。

console.log(5 < 10);   // true
console.log(10 < 5);   // false
console.log(10 < 10);  // false

小なりまたは等しい(<=)演算子

小なりまたは等しい演算子(<=)は、左側の値が右側の値よりも小さいか等しいかどうかをチェックします。

console.log(5 <= 10);   // true
console.log(10 <= 10);  // true
console.log(10 <= 5);   // false

null、undefined、NaNの比較

nullundefinedNaNなどの特別な値を比較するのは少し難しいことがあります。いくつかの例を見てみましょう:

console.log(null == undefined);  // true
console.log(null === undefined);  // false
console.log(NaN == NaN);  // false
console.log(NaN === NaN);  // false
console.log(null > 0);  // false
console.log(null == 0);  // false
console.log(null >= 0);  // true

nullundefinedの動作は意外なことがあります。NaNは何にでも等しくありません。そして、nullは比較では0に変換されますが、等価チェックでは変換されません。

そして、みんな!JavaScriptの比較演算子の旅はここまでです。実践で完璧にするまで練習するのは悪いことではありません。これらの演算子を自分のコードで試してみてください。ハッピーコーディング!

Credits: Image by storyset