プログラミング

【TypeScriptでの等価演算子】== と === の本当の違いを理解する

※当サイトではアフィリエイトプログラムを利用して商品を紹介しています。

パソコン操作

ひでまる
ひでまる
こんにちは!ひでまるです!

こんな方におすすめ

  • プログラミング初心者の方
  • TypeScriptを勉強している方

 

ひでまる
ひでまる
今回はTypeScriptを学習していくよ〜

新しい開発の仕事でTypeScriptを使っていくことになったので、自分の学習記録として記事に残していきます!
プログラミングを学習している方、一緒にレベルアップしていきましょう!

 

記事の信頼性

  • 元プログラミングスクール講師で100人以上の生徒を担当
  • 企業のIT新人研修講師の経験
  • 現役エンジニア

それでは、行きましょう!

 

 

== と ===の違い

他のプログラミング言語もそうですが、TypeScriptでも「==」と「===」比較するための演算子が存在します。

比較するとは、〇〇と〇〇は同じもの?と尋ねるようなイメージです。
同じものであれば結果は「true」、違うものであれば結果は「false」になります。

const num = 1;
const str = '1'
console.log(num === str) // false

 

数字の「1」と文字の「1」は違うのでfalseといった感じです!

 

==は等価演算子

「==」は値を比較するときに、「型」変換を行います

const num = 1;
const str = '1' 
console.log(num == str) // true

numには数値(number型)の1
strには文字(string型)の1
が入っています。

「==」を使って比較するときは、strに入ってる文字の1が数値に変換されて比較を行います。

つまり、数値の「1」と数値の「1」が比較となり、結果はtrueとなります。

 

==は厳密等価演算子

「===」は値と型の両方を比較し、両方が完全一致しない限り、結果はfalseとなります。

const num = 1;
const str = '1' 
console.log(num === str) // false

numには数値(number型)の1
strには文字(string型)の1

「===」を使って比較する場合は数値の「1」と文字の「1」での比較となり、数値と文字で違うため、結果はfalseとなります。

 

どっちを使えばいいの?

実際の開発では、意図しない型変換を防ぐために、「===」が推奨されています。

型変換されてしまうと予期せぬバグが起きるので、「===」はそれを防ぐのに役立ちます!

 

 

まとめ

「==」は等価演算子といい、比較する際は型変換を行って値を比較する。

「===」は厳密等価演算子といい、比較する際は値と型を見て比較する。

推奨されているのは「===」を使って比較する。

 

TypeScriptの学習ではこちらの本がおすすめです!
内容的に難しいところもありますが、本気で学びたい人は買って損しない一冊です!

 

-プログラミング