JavaScriptの「==」と「===」の違いとは？厳密等価演算子と等価演算子をわかりやすく解説

JavaScriptには、値を比較するための2つの等価演算子があります。本記事では、厳密等価演算子 === と等価演算子 == の違い、そしてその違いを理解することの重要性を詳しく解説します。

JavaScriptで値を比較する際に使える等価演算子は2種類あります。1つは緩い比較を行う等価演算子 ==（ダブルイコール）、もう1つは厳密な比較を行う厳密等価演算子 ===（トリプルイコール）です。

この2つは一見同じように見えますが、実際の動作はまったく異なります。違いを理解していないと、思わぬバグの原因になるため注意が必要です。

まずは、次のコードをブラウザのコンソールで実行してみてください。

let a = 4 // 数値型
let b = "4" // 文字列型

console.log(a == b) // 出力：true

数値の 4 と文字列の "4" を比較しているのに、結果が true になっています。型が異なる値同士なのに、なぜ等しいと判定されるのでしょうか？

等価演算子（==）による暗黙的な型変換

この現象の原因は、== 演算子の動作にあります。== を使った場合、オペランド同士の型が異なっていれば、JavaScriptが自動的に両者を同じ型へ変換してから値を比較します。

この処理は型強制（type coercion）と呼ばれます。つまり、== による比較では、値の型が統一された後に初めて値の一致が確認されるのです。

先ほどの例で true が出力されたのは、比較の前に文字列 "4" が数値 4 に変換されていたからです。直感に反する動作だと感じる方も多いでしょうが、これがJavaScriptの仕様です。

重要なのは、この厄介な「仕様」の存在を把握しておくことです。

厳密等価演算子（===）なら予測通りの結果に

ここで活躍するのが厳密等価演算子 === です。=== は型変換を行わず、値の型まで含めて厳密に比較します。

let a = 4
let b = "4"

console.log(a === b)
// 出力：false

今度は false が出力されました。変数 a と b はどちらも「4」という値を持っていますが、a は数値型、b は文字列型であり、型が異なるため等しいと判定されないのです。

== と違って === は常に予測可能な結果を返します。そのため、多くの開発者は == の使用を避け、=== を使うことを推奨しています。

非厳密な比較演算子（==）を使うべきケースはある？

結論から言えば、== を使う合理的な理由はほとんどありません。

基本ルールとして、常に厳密等価演算子 === を使うのが安全です。明確に == の挙動が必要な特別な理由がある場合のみ、例外的に == を検討しましょう。

この習慣を身につければ、誤った等価演算子の使用によって引き起こされるバグを未然に防ぐことができます。コードの信頼性を高める意味でも、=== をデフォルトとして選ぶことをおすすめします。