Verwenden Sie in JS nicht mehr überall Operatoren für absolute Gleichheit.

Verwenden Sie in JS nicht mehr überall Operatoren für absolute Gleichheit.

Überblick

Wir wissen, dass Entwickler jetzt === statt == verwenden. Warum?

Die meisten Tutorials, die ich online gesehen habe, stimmen darin überein, dass es zu kompliziert ist, vorherzusagen, wie die JavaScript-Umwandlung funktioniert, und empfehlen daher, immer === zu verwenden.

Dies führt dazu, dass viele Programmierer Teile der Sprache ausschließen und dies als Fehler betrachten, anstatt ihr Verständnis des Prozesses zu erweitern.

Die folgenden beiden Anwendungsfälle veranschaulichen die Vorteile der Verwendung von ==.

1. Test auf Nullwerte

wenn (x == null)
Gegen
wenn (x === undefiniert || x === null)

2. Benutzereingaben lesen

let userInput = document.getElementById('Betrag');
sei Betrag = 999;
wenn (Betrag == Benutzereingabe)
Gegen
wenn (Betrag === Zahl(Benutzereingabe))

In diesem Artikel werden wir tiefer in das Thema eintauchen, indem wir die Unterschiede gegenüberstellen, Zwang verstehen, einige beliebte Anwendungsfälle untersuchen und schließlich Richtlinien finden, die uns bei unserer Entscheidung helfen.

Einführung

In JavaScript wird Gleichheit mit zwei Operatoren erreicht.

1. === – Der strikte Gleichheitsvergleich wird auch als dreifacher Gleichheitsoperator bezeichnet.

2. == — Abstrakter Gleichheitsvergleich

Ich habe === verwendet, weil mir gesagt wurde, dass es immer besser als == ist und ich überhaupt nicht darüber nachdenken muss, was ich als fauler Mensch praktisch finde.

Bis ich mir bei Frontend Masters „Deep JavaScript Foundations“ von Kyle oder @getfiy, dem Autor von You Don’t Know JS, angesehen habe.

Die Tatsache, dass ich als professioneller Programmierer nicht tief über die Operatoren nachdenke, die ich bei meiner täglichen Arbeit verwende, inspiriert mich dazu, das Bewusstsein dafür zu schärfen und die Menschen zu ermutigen, den Code, den wir schreiben, besser zu verstehen und sich mehr darum zu kümmern.

Wo liegt die Wurzel dieser Tatsache?

Es ist wichtig zu wissen, wo der wahre Grund liegt. Weder in Mozillas W3school, noch in den Hunderten von Artikeln, in denen behauptet wird, === sei besser als ==, und schon gar nicht in diesem Artikel. .

In der JavaScript-Spezifikation finden wir Dokumentation zur Funktionsweise von JavaScript.

Den gesunden Menschenverstand brechen

1. == prüft nur den Wert (lose)

Wenn Sie sich die Spezifikation ansehen, geht aus der Definition ziemlich klar hervor, dass der Algorithmus als Erstes tatsächlich den Typ überprüft.

2. === Wert und Typ prüfen (streng)

Auch hier können wir der Spezifikation entnehmen, dass eine Prüfung der Typen erfolgt und bei Unterschieden die Werte nicht noch einmal geprüft werden.

Der wirkliche Unterschied zwischen doppelter und dreifacher Gleichheit besteht darin, ob wir Zwang zulassen.

Zwang in JavaScript

Casting oder Typkonvertierung ist eine der Grundlagen jeder Programmiersprache. Dies ist insbesondere bei dynamisch typisierten Sprachen wie JavaScript wichtig, da der Compiler Sie nicht anschreit und beschwert, wenn sich der Typ ändert.

Das Verständnis von Imperativen bedeutet, dass wir den Code auf die gleiche Weise wie JavaScript interpretieren können, was uns eine größere Skalierbarkeit bietet und Fehler minimiert.

Explizite Nötigung

Das Casting kann explizit erfolgen, wenn der Programmierer eine dieser Methoden aufruft und dadurch eine Änderung des Typs einer Variablen erzwingt.

Boolean(), Zahl(), BigInt(), String(), Objekt()

Fall:

sei x = "foo";
Typ von x // Zeichenfolge
x = Boolean('foo')
Typ von x // Boolesch

Transformation ausblenden

In JavaScript sind Variablen schwach typisiert, das heißt, sie können automatisch konvertiert werden (implizit erzwungen). Dies ist normalerweise der Fall, wenn wir die Rechenoperatoren + / – *, den umgebenden Kontext oder == verwenden.

2 / '3' // '3' muss 3 sein
new Date() + 1 // Wird zu einem Datumsstring gezwungen, der mit 1 endet if(x) // x wird zu einem Booleschen Wert gezwungen 1 == true // true wird zu 1 gezwungen
1 == 'true' // 'true' wird zu NaN umgewandelt
`diese ${variable} wird in einen String umgewandelt

Implizite Zwangsmaßnahmen sind ein zweischneidiges Schwert. Der richtige Einsatz kann die Lesbarkeit verbessern und die Ausführlichkeit reduzieren. Wir haben ein Rezept für Enttäuschung: Wenn wir es falsch verwenden oder missverstanden haben, schimpfen die Leute und geben JavaScript die Schuld.

Vergleich von Algorithmen

== Operatoralgorithmus

1. Wenn X und Y vom gleichen Typ sind, wird === ausgeführt.

2. Wahr, wenn X null und Y undefiniert ist oder umgekehrt.

3. Wenn das eine eine Zahl ist, zwingen Sie das andere dazu, eine Zahl zu sein.

4. Wenn es sich um ein Objekt handelt, wird es auf das ursprüngliche Objekt umgewandelt.

5. Andernfalls geben Sie „false“ zurück.

=== Vergleichsalgorithmus

1. Wenn die Typen nicht übereinstimmen, ist „false“.

2. Wenn die Typen übereinstimmen, vergleichen Sie die Werte und geben Sie „false“ zurück, wenn es NaN ist.

3.-0 — stimmt.

Beliebte Anwendungsfälle

1. Gleicher Typ (in den meisten Fällen)

Wenn die Typen gleich sind, ist === genau dasselbe wie ==. Daher sollte diejenige mit der größeren semantischen Bedeutung verwendet werden.

1 == 1 // wahr ...... 1 === 1 // wahr
'foo' == 'foo' // wahr ...... 'foo' === 'foo' // wahr

Die Typen sind unterschiedlich, ich verwende lieber ===.

2. Verschiedene Typen (primitive Typen)

Zunächst möchte ich Ihre Aufmerksamkeit auf die Tatsache lenken, dass unterschiedliche Typen nicht unbekannte Typen bedeuten. Die Typen nicht zu kennen, weist auf ein größeres Problem in Ihrem Code hin als nur === statt == zu verwenden. Die Kenntnis der Typen weist auf ein tieferes Verständnis des Codes hin, was zu weniger Fehlern führt.

Angenommen, wir haben die Möglichkeit einer Zahl oder einer Zeichenfolge. Denken Sie daran, dass der Algorithmus numerische Typen bevorzugt. Daher wird er versuchen, toNumber() zu verwenden.

sei foo = 2;
let bar = 32; // Zahl oder Zeichenfolge
foo == bar // Wenn bar ein String ist, wird er in eine Zahl umgewandelt
foo === Number(bar) // macht im Grunde dasselbe
foo === bar // wobei bar ein String ist, dann ist das Ergebnis false

3. null und undefiniert

Bei der Verwendung von == sind null und undefined einander gleich.

lass foo = null
let bar = undefiniert; 
foo == bar // wahr
foo === bar // falsch

4. Nicht-primitive Typen [Objekte, Arrays]

Sie sollten == oder === nicht verwenden, um nicht-primitive Typen wie Objekte und Arrays zu vergleichen.

Entscheidungskriterien

1. Es ist am besten, == in allen Situationen zu verwenden, in denen es verwendet werden kann.

2. == Bei einem bekannten Typ können Sie die Typkonvertierung erzwingen.

3. Den Typ zu kennen ist besser, als ihn nicht zu kennen.

4. Wenn Sie den Typ nicht kennen, verwenden Sie nicht ==.

5. === ist bedeutungslos, wenn die Typen nicht übereinstimmen.

6. === ist unnötig, wenn die Typen übereinstimmen.

Vermeiden Sie die Verwendung von ==

In einigen Fällen sollten Sie == nicht verwenden, ohne sich wirklich mit falschen Werten in JavaScript auszukennen.

== mit 0 oder "" oder " "
== mit Nicht-Primitiven
== true oder == false

Zusammenfassen

Nach meiner bisherigen Erfahrung kannte ich immer den Typ der Variablen, mit der ich es zu tun hatte, und wenn nicht, verwendete ich typeof, um nur die erwarteten Variablen zuzulassen.

Vier Punkte, die Sie beachten sollten

1. Wenn Sie den Variablentyp nicht kennen, ist die Verwendung von === die einzig sinnvolle Wahl

2. Wenn Sie den Typ nicht kennen, kann das bedeuten, dass Sie den Code nicht verstehen. Versuchen Sie, Ihren Code umzugestalten.

3. Wenn Sie die Typen kennen, können Sie besseren Code schreiben.

4. Wenn der Typ bekannt ist, ist es besser, == zu verwenden.

Oben finden Sie ausführliche Informationen dazu, wie Sie den absoluten Gleichheitsoperator nicht überall in JS verwenden. Weitere Informationen zu JS finden Sie in den anderen verwandten Artikeln auf 123WORDPRESS.COM!

Das könnte Sie auch interessieren:
  • JavaScript-Operatoren wurden so ausführlich erklärt wie nie zuvor
  • Zusammenfassung ungewöhnlicher JS-Operationsoperatoren
  • JavaScript-Grundlagenoperatoren
  • Zusammenfassung ungewöhnlicher Operatoren und Operatoren in js
  • Zusammenfassung einiger effizienter magischer Operatoren in JS
  • Werfen wir einen Blick auf die gleiche alte JS-Operator-Erklärung

<<:  Übersicht über MySQL-Statistiken

>>:  Detaillierte Erklärung, wie man HSTS in nginx aktiviert, um den Browser zu zwingen, auf HTTPS-Zugriff umzuleiten

Artikel empfehlen

Installationsschritte von Docker-CE auf dem Raspberry Pi 4b Ubuntu19-Server

Das Raspberry Pi-Modell ist 4b, 1 G RAM. Das Syst...

Semantische Webseiten XHTML semantische Auszeichnung

Ein weiterer wichtiger Aspekt bei der Trennung vo...

So verstehen Sie SELinux unter Linux

Inhaltsverzeichnis 1. Einführung in SELinux 2. Gr...

Erläuterung, ob im interaktiven Design Paging oder Laden gewählt werden soll

Der Autor dieses Artikels @子木yoyo hat ihn in seine...

Besprechen Sie den Entwicklungstrend der Baidu Encyclopedia UI

<br />Die offizielle Version der Baidu-Enzyk...

Wissen Sie, wie viele Verbindungen ein Linux-Server verarbeiten kann?

Vorwort Sehen wir uns zunächst an, wie eine TCP-V...

XHTML: Rahmenstruktur-Tag

Rahmenstruktur-Tag <frameset></frameset&...

Zusammenfassung der MySQL-Indexkenntnisse

Die Einrichtung eines MySQL-Index ist für den eff...

Viewport-Parameter für mobile Browser (Web-Frontend-Design)

Mobile Browser platzieren Webseiten in einem virtu...

Eine detaillierte Analyse und Verarbeitung von MySQL-Alarmen

Vor kurzem hat ein Dienst einen Alarm ausgelöst, ...

...