【JavaScript基礎】JavaScriptの等価比較（==, ===）について

こんにちは。

今回は基本的なことではあるけど、正しく覚えていないことの多いJavaScriptの比較についてまとめようと思います。

等価演算子の種類 ==と===

まず、JavaScriptの等価演算子は2種類存在しており、
これはデータ型の変換が行われるかどうかに違いがあります。

・等価演算子　==
こちらはデータ型の変換を行います。
つまり数値と文字列を比較すれば数値として比較されます。この時データ型は左辺右辺関係なく数値型に変換されます。

・数値と文字列　0 == “0” //true
・Boolean(0:false 1:ture)　1 == true //true
・nullとundefined　null == undefined //true
・配列　[‘A‘, B‘, ‘C‘] == [‘A‘, ‘B‘, ‘C‘] //false 参照先が違う(別宣言)
・進数違い　‘0x10‘ == 16 //true

・厳密等価演算子　==
こちらはデータ型の変換を行いません。
したがって文字列は文字列、数値は数値として取り扱います。
配列やオブジェクトなど参照先を確認するものは型変換ではないので違いはありません。

・数値と文字列　0 == “0” //false
・Boolean(0:false 1:ture)　1 == true //false
・nullとundefined　null == undefined //false
・配列　[‘A‘, B‘, ‘C‘] == [‘A‘, ‘B‘, ‘C‘] //false 参照先が違う(別宣言)
・進数違い　‘0x10‘ == 16 //false

どちらを使うべきか

結論から申し上げますと、「===」を使った方が安全です。
理由としては、型変換を行うかどうかにあります。

「==」における型変換は、プログラム作成者が意図して記載したわけではなく、
暗黙の型変換としてプロぐっらむ側が自動で行うものです。
0 == “0”程度であればさほど問題にはならないかもしれませんが、予期せず型変換が行われ条件を突破してしまう場面があると
バグを引き起こす鯨飲となりかねないためです。

場面にもよりますが、基本的に「===」を利用し、型変換が必要な場合は明示的に行うようにした方がよいです。

0 === Number(“0”) //true

ついでに

Switch文のcase比較には===が利用されます。

var a = 1
switch(a) {
case ‘1’:
console.log(‘文字列’1’と等価です’)
case 1:
console.log(‘数値1と等価です’)

コンソール： 数値1と等価です

まとめ

・JavaScriptには等価演算子(==)と厳密等価演算子(===)がある
・二つの違いは暗黙の型変換が行われるかどうか
・厳密等価演算子を利用した方が安全

「===を使うべき」と覚えている人は多くても、何が違うのかは忘れがちで
基礎の段階で説明できる方は少ないのかなと思います。

知ってるけど説明できないものは理解しているとは言えないと思いますので、
こういったものを見つけたらまた記事にしようと思います。