【JavaScript】イコールの数による比較の違い。==と===はどちらを使うべきか?(等価演算子と厳密等価演算子)

javascript-prograshi(プロぐらし)-kv JavaScript
記事内に広告が含まれていることがあります。

JavaScriptのコードを書いていて「==と===、どっちを使えばいいんだろう…」と迷ったことはありませんか?

この疑問は、プログラミング初心者にとって非常に一般的です。この2つのイコールを正しく理解する鍵は「型」にあります。

この記事では、この疑問を完全に解消するための決定版ガイドとなるべく、==(等価)と===(厳密等価)の違い、そしてどちらをあなたのコードの標準にすべきかを、具体的に解説しています。


==(等価演算子)

==とは何か?

== は、比較する「値が等しいかどうか」だけをチェックします。

必要に応じて自動で型を合わせる処理(型変換)が行われます。

MEMO

== を「等価演算子」と言います。「等価」と呼ぶこともあります。


注意点

==は、値を比較する前に、オペランド(比較対象)の型が異なる場合は、JavaScriptが自動的に一方または両方のオペランドを共通の型に変換してから比較します。

このため、予期せぬ結果を生む可能性があるため、使用には注意が必要です。


例えば「5」は数値(number型)ですが、「”5″」は文字列(string型)です。数値と文字列なので本来は違います。

ところが、 == で比較を行うと結果は「true」になります。

5 == "5" //true

これは、文字列「”5″」が数値「5」に自動で変換され、「5 == 5」となるためです。


他にも「0 == false」や「null == undefined」がtrueになります。

結果理由
5 == "5"true文字列"5"が数値5に変換され、5 == 5となるため。
0 == falsetruefalseが数値0に変換され、0 == 0となるため。
null == undefinedtrue特殊なルールにより、この組み合わせでは型変換なしでtrueとなります。


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

===とは何か?

=== は、値だけでなく、型もチェックします。

===は、型変換を一切行いません。オペランドの型が異なれば、値が同じであっても即座にfalseを返します。

比較の動作が明確で一貫しているため、予期せぬバグを防ぎやすいという特徴があります。

MEMO

=== を「厳密等価演算子」と言います。「厳密等価」と呼ぶこともあります。


例えば「5」は数値(number型)ですが、「”5″」は文字列(string型)です。

これを、 === で比較すると結果は「false」になります。

5 == "5" //false


同様にして、== よりもより厳密に比較をすることができます。

結果理由
5 === "5"false値は同じですが、(数値 vs 文字列)が異なるため。
0 === falsefalse値は等価とみなされますが、(数値 vs 真偽値)が異なるため。
null === undefinedfalse値は==trueですが、型が異なるため。
5 === 5true値も型も同じであるため。



どちらを使うべきか?

ほとんどの状況で「===(厳密等価演算子)」を使うべきです

型変換が行われないため、コードの動作が直感的でわかりやすく、意図しない型変換による予期せバグを防ぐことができます。

特に、大規模なアプリケーション開発において重要です。

また、開発者は、比較する値の型を意識するようになるため、より堅牢なコードを書く習慣がつきます。

MEMO

特別な理由がない限り、常に === を使用する。

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