JS のあらゆる場所で絶対等価演算子の使用をやめる

概要

開発者が == の代わりに === を使用するようになったのはわかっていますが、なぜでしょうか?

私がオンラインで見たほとんどのチュートリアルでは、JavaScript の強制変換がどのように機能するかを予測するのは複雑すぎるため、常に === を使用することを推奨しています。

このため、多くのプログラマーは、プロセスに対する理解を深めるのではなく、言語の一部を除外し、それを欠陥と見なすようになります。

次の 2 つの使用例は、== を使用する利点を示しています。

1. NULL値のテスト

(x == null)の場合
対
(x === 未定義 || x === null)の場合

2. ユーザー入力を読み取る

userInput を document.getElementById('amount') に設定します。
金額を 999 とします。
if (金額 == ユーザー入力)
対
if (amout === Number(userInput))

この記事では、違いを比較し、強制を理解し、いくつかの一般的な使用例を検討し、最後に決定を導くガイドラインを見つけることで、このトピックを深く掘り下げます。

導入

JavaScript では、等価性は 2 つの演算子によって実現されます。

1. === — 厳密な等価比較は三重等価演算子とも呼ばれます。

2. == — 抽象的な等価比較

私は === を使うようにしていますが、それは == よりもずっと良いと言われてきたからです。それに、何も考える必要がないので、怠け者の私にとっては便利だと思います。

Frontend Masters で、You Don't Know JS の著者である Kyle または @getfiy による「Deep JavaScript Foundations」を視聴するまではそうでした。

プロのプログラマーとして、仕事で毎日使用する演算子について深く考えていないという事実が、認識を広め、私たちが書くコードについて人々がもっと理解し、気にかけるように促すきっかけになっています。

事実の根源はどこにあるのでしょうか?

本当の理由がどこにあるのかを知ることが重要です。 Mozilla の W3school にも、=== が == よりも優れていると主張する何百もの記事にも、そしてもちろんこの記事にも、そのような記述はありません。 。

JavaScript 仕様には、JavaScript がどのように動作するかについてのドキュメントが記載されています。

常識を破る

1. == は値のみをチェックします (緩い)

仕様を見ると、アルゴリズムが最初に行うことは実際に型をチェックすることであることが定義からかなり明らかです。

2. === 値と型をチェックする（厳密）

ここでも、仕様から、型をチェックし、異なる場合は値を再度チェックしないことがわかります。

二重等号と三重等号の本当の違いは、強制を許可するかどうかです。

JavaScript での強制

キャストまたは型変換は、あらゆるプログラミング言語の基本の 1 つです。 これは、JavaScript のような動的型付け言語では特に重要です。型が変わってもコンパイラが怒鳴ったり、大騒ぎしたりしないからです。

命令形を理解するということは、JavaScript と同じようにコードを解釈できるということであり、スケーラビリティが向上し、エラーが最小限に抑えられます。

明示的な強制

プログラマーがこれらのメソッドの 1 つを呼び出すと、キャストが明示的に実行され、変数の型が強制的に変更されます。

ブール値()、数値()、BigInt()、文字列()、オブジェクト()

場合：

x = 'foo' とします。
typeof x // 文字列
x = ブール値('foo')
typeof x // ブール値

変換を非表示

JavaScript では、変数は弱い型付けであるため、自動的に変換（暗黙的に強制変換）できます。 これは通常、算術演算子 + / — * や周囲のコンテキストを使用する場合、または == を使用する場合に当てはまります。

2 / '3' // '3' は 3 に強制される
new Date() + 1 // 1 で終わる日付文字列に強制変換されます if(x) // x はブール値に強制変換されます 1 == true // true は 1 に強制変換されます
1 == 'true' // 'true' は NaN に強制変換されます
`この${variable}は文字列に変換されます

暗黙的な強制は諸刃の剣です。適切に使用すれば、読みやすさが向上し、冗長性が軽減されます。不適切に使用されたり誤解されたりすると失望する公式があり、人々は JavaScript を非難して非難するでしょう。

アルゴリズムの比較

== 演算子アルゴリズム

1. XとYが同じ型の場合、===が実行されます。

2. X が null で Y が未定義の場合、またはその逆の場合は True になります。

3. 一方が数値の場合、もう一方も数値になるように強制します。

4. 一方がオブジェクトの場合は、元のオブジェクトにキャストします。

5. それ以外の場合は false を返します。

=== 比較アルゴリズム

1. 型が一致しない場合は false です。

2. 型が一致する場合、値を比較し、NaN の場合は false を返します。

3.-0 — 本当です。

人気のユースケース

1. 同じタイプ（ほとんどの場合）

型が同じであれば、=== は == とまったく同じになります。したがって、より意味的な意味を持つものを使用する必要があります。

1 == 1 // 真 ...... 1 === 1 // 真
'foo' == 'foo' // 真 ...... 'foo' === 'foo' // 真

型は異なりますが、私は === を使用することを好みます。

2. 異なる型（プリミティブ型）

まず、異なるタイプが未知のタイプを意味するわけではないという事実に注目していただきたいと思います。型がわからないということは、単に === と == を使用するよりもコードに大きな問題があることを示しています。型を知ることは、コードに対する理解を深めることを意味し、バグの減少につながります。

数字または文字列の可能性があるとします。アルゴリズムは数値型を優先するため、toNumber()を使用しようとすることに注意してください。

foo = 2 とします。
let bar = 32; // 数値または文字列
foo == bar // barが文字列の場合は数値に変換されます
foo === Number(bar) // 基本的に同じこと
foo === bar // bar が文字列の場合、結果は false になります

3. null および undefined

== を使用すると、null と undefined は互いに等しくなります。

foo = null とする
bar = undefined とします。 
foo == bar // 真
foo === bar // 偽

4. 非プリミティブ型 [オブジェクト、配列]

オブジェクトや配列などの非プリミティブ型を比較す​​る場合は、== または === を使用しないでください。

意思決定基準

1. 使用できるすべての状況で == を使用するのが最適です。

2. == 既知の型の場合、型変換を強制することを選択できます。

3. タイプを知っているほうが知らないよりも良いです。

4. 型がわからない場合は、== を使用しないでください。

5. 型が一致しない場合、=== は意味がありません。

6. 型が一致する場合は === は不要です。

==の使用を避ける

JavaScript では、偽値を十分に理解せずに == を使用すべきでない場合があります。

== 0 または "" または " "
== 非プリミティブの場合
== 真または == 偽

要約する

これまでの経験では、扱っている変数の型は常にわかっていましたが、わからない場合は、typeof を使用して、予想される変数のみを許可していました。

注目すべき4つのポイント

1. 変数の型がわからない場合は、===を使用するのが唯一の合理的な選択です。

2. 型がわからないということは、コードを理解していない可能性があるので、コードをリファクタリングしてみてください。

3. 型を知ることで、より良いコードを記述できるようになります。

4. 型がわかっている場合は、== を使用する方がよいでしょう。

上記は、JS のどこでも絶対等価演算子を使用しないことに関する詳細な内容です。JS の詳細については、123WORDPRESS.COM の他の関連記事に注目してください。