JavaScriptやTypeScriptを使っていると、普段から使い慣れた演算子である!=。ある日、chatGPTが!==という記号を提示してきたとき、「これはタイプミスか⁇」と戸惑ったことがありました。しかし調べてみると、「厳密不等価」という比較演算子であることが判明。
今回は!==の意味と使い方について解説します。
!==とは⁇
JavaScript（およびTypeScript）では、!==は「厳密不等価演算子（strict inequality）」を表します。この演算子は以下のように動作します。
- 値 および型 が異なる場合にtrueを返す
- それ以外の場合はfalseを返す
一方、!=は「不等価演算子（inequality）」と呼ばれ、型変換を行った上で値が異なるかを判断します。
!==と!=の違いを比較
コード例で違いを見てみましょう。
*//* 不等価演算子 *(!=)*
console.log(5 != "5"); *// false (値が同じなので等価と判断)
// 厳密不等価演算子 (!==)*
console.log(5 !== "5"); *// true (型が異なるため不等価と判断)*
上記の例からわかるように、!=は型を無視するため、5と"5"を同じものと見なします。一方、!==は型まで考慮するため、より厳密な比較が可能です。
chatGPTのコード提案で遭遇
React Native/TypeScriptで開発しているとき、以下のようなコードでchatGPTが提案してきました。
if (userId !== undefined) {
console.log("User ID is defined.");
}
最初は「!=で十分では⁇」と思いましたが、!==を使うことで、nullとundefinedを区別するときに使用できることが判明。
const userId = undefined;
console.log(userId != null); // false (型変換される)
console.log(userId !== null); // true (厳密に比較される)
この挙動のおかげで、バグの原因となる曖昧な条件判定を避けることができた（はず）。
※undefinedもnullも「データがない」ことで共通していますが、undefinedは「値が未定義」、nullは「値が意図的に空」の状態。Redditにわかりやすい画像があったので添付。
(https://www.reddit.com/r/ProgrammerHumor/comments/f03mhi/null_undefined_0/)
なぜ!==を使うべき⁇
React NativeやTypeScriptでは、特に型安全性が重視されます。
それに、どんな言語を使っていても予期せぬ挙動は避けたいですよね。不用意にリスクを増やさない、他のエンジニアに意図が伝わるなどメリットが多いので、使える場面はなるべく使っていきたいですね。