JavaScript Häufige Fehler

In diesem Kapitel besprechen wir häufige JavaScript-Fehler.

Falsche Verwendung des Zuweisungsoperators

Wenn Sie in einem JavaScript-Programm das Gleichheitszeichen (=) des Zuweisungsoperators in einer if-Bedingungsanweisung verwenden, erzeugt dies ein falsches Ergebnis. Die korrekte Methode ist, das doppelte Gleichheitszeichen (==) des Vergleichsoperators zu verwenden.

ifDie Bedingungsanweisung liefertfalse(wie erwartet), weil x nicht gleich 10 ist:

var x = 0;
if (x == 10)

Selbst ausprobieren »

ifDie Bedingungsanweisung lieferttrue(nicht wie erwartet), weil die Bedingungsanweisung x = 10 zuweist und 10 wahr ist:

var x = 0;
if (x = 10)

Selbst ausprobieren »

ifDie Bedingungsanweisung liefertfalse(nicht wie erwartet), weil die Bedingungsanweisung x = 0 zuweist und 0 falsch ist:

var x = 0;
if (x = 0)

Selbst ausprobieren »
Note Eine Zuweisungsanweisung gibt den Wert der Variablen zurück.

Häufige Fehler bei Vergleichsoperatoren

Bei einem normalen Vergleich wird der Datentyp ignoriert. Die folgende if-Bedingungsanweisung liefert true:

var x = 10;
var y = "10";
if (x == y)

Selbst ausprobieren »

Bei einem strikten Vergleich ist === der Identitätsoperator, der sowohl den Wert als auch den Typ der Ausdrücke prüft. Die folgende if-Bedingungsanweisung liefert false:

var x = 10;
var y = "10";
if (x === y)

Selbst ausprobieren »

Diese Art von Fehler tritt häufig in switch-Anweisungen auf, weil switch-Anweisungen den Identitätsoperator (===) zum Vergleich verwenden:

Das folgende Beispiel führt ein Alert-Popup aus:

var x = 10;
switch(x) {
    case 10: alert("Hello");
}

Selbst ausprobieren »

Das folgende Beispiel führt kein Alert-Popup aus, da die Typen nicht übereinstimmen:

var x = 10;
switch(x) {
    case "10": alert("Hello");
}

Selbst ausprobieren »

Vorsichtsmaßnahmen bei Addition und Verkettung

Additionbedeutet, zweiZahlenzusammenzuzählen.

Verkettungbedeutet, zweiStringsmiteinander zu verbinden.

JavaScript verwendet den +-Operator sowohl für Addition als auch für Verkettung.

Als Nächstes können wir anhand von Beispielen den Unterschied zwischen der Addition zweier Zahlen und der Verkettung einer Zahl mit einem String sehen:

var x = 10 + 5;          // Das Ergebnis von x ist 15
var x = 10 + "5";        // Das Ergebnis von x ist "105"

Selbst ausprobieren »

Die Verwendung von Variablen für die Addition führt ebenfalls zu inkonsistenten Ergebnissen:

var x = 10;
var y = 5;
var z = x + y;           // Das Ergebnis von z ist 15

var x = 10;
var y = "5";
var z = x + y;           // Das Ergebnis von z ist "105"

Selbst ausprobieren »

Vorsichtsmaßnahmen für Gleitkommadaten

Alle Daten in JavaScript werden als 64-BitGleitkommadaten (float)zur Speicherung abgelegt.

Alle Programmiersprachen, einschließlich JavaScript, finden es schwierig, die Präzision von Gleitkommadaten zu bestimmen:

var x = 0.1;
var y = 0.2;
var z = x + y            // Das Ergebnis von z ist 0.30000000000000004
if (z == 0.3)            // gibt false zurück

Selbst ausprobieren »

Um das obige Problem zu lösen, können Sie Ganzzahlmultiplikation und -division verwenden:

Beispiel

var z = (x * 10 + y * 10) / 10;       // Das Ergebnis von z ist 0.3

Selbst ausprobieren »

Weitere Informationen finden Sie unter:Präzisionsprobleme in JavaScript und Lösungen

Zeilenumbrüche in JavaScript-Strings

JavaScript ermöglicht es uns, Zeilenumbrüche in Strings zu verwenden:

Beispiel 1

var x =
"Hello World!";

Selbst ausprobieren »

Wenn du jedoch einen Wagenrücklauf-Zeilenumbruch direkt in einer Zeichenkette verwendest, verursacht dies einen Fehler:

Beispiel 2

var x = "Hello
World!";

Selbst ausprobieren »

Du kannst die Entwicklertools öffnen oder F12 drücken, um die Fehlermeldung anzuzeigen:

Um einen Zeilenumbruch in einer Zeichenkette zu erzeugen, musst du einen Backslash (\) verwenden, wie unten gezeigt:

Beispiel 3

var x = "Hello \
World!";

Selbst ausprobieren »

Falsche Verwendung von Semikolons

Im folgenden Beispiel verliert die if-Anweisung ihren Rumpf. Der ursprüngliche Rumpf der if-Anweisung wird als eigenständiger Codeblock ausgeführt, was zu einer falschen Ausgabe führt.

Aufgrund der falschen Verwendung des Semikolons wird der Codeblock in der if-Anweisung immer ausgeführt:

if (x == 19);
{
    // code block 
}

Selbst ausprobieren »

Hinweise zur return-Anweisung

Standardmäßig endet JavaScript automatisch am Ende einer Zeile.

Die folgenden beiden Beispiele liefern dasselbe Ergebnis (eines enthält ein Semikolon, das andere nicht):

Beispiel 1

function myFunction(a) {
    var power = 10 
    return a * power
}

Selbst ausprobieren »

Beispiel 2

function myFunction(a) {
    var power = 10;
    return a * power;
}

Selbst ausprobieren »

JavaScript kann auch mehrere Zeilen verwenden, um eine Anweisung darzustellen, was bedeutet, dass eine Anweisung über mehrere Zeilen aufgeteilt werden kann.

Die folgenden Beispiele liefern dasselbe Ergebnis:

Beispiel 3

function myFunction(a) {
    var
    power = 10; 
    return a * power;
}

Selbst ausprobieren »

Das folgende Beispiel wird jedochundefined zurückgeben：

Beispiel 4

function myFunction(a) {
    var
    power = 10; 
    return
    a * power;
}

Selbst ausprobieren »

Warum passiert das? Weil der Code in Beispiel 4 in JavaScript dem folgenden Code entspricht:

function myFunction(a) {
    var
    power = 10;  
    return;       // 分号结束，返回 undefined
    a * power;
}

Erklärung

Wenn es sich um eine unvollständige Anweisung handelt, wie unten gezeigt:

var

JavaScript wird versuchen, die Anweisung in der zweiten Zeile zu lesen:

power = 10;

Aber weil eine solche Anweisung vollständig ist:

return

JavaScript wird die Anweisung automatisch schließen:

return;

In JavaScript sind Semikolons optional.

Da return eine vollständige Anweisung ist, wird JavaScript die return-Anweisung beenden.

Note Hinweis:Teilen Sie die return-Anweisung nicht auf mehrere Zeilen auf.

Verwenden von Namen zum Indizieren von Arrays

Viele Programmiersprachen erlauben die Verwendung von Namen als Array-Indizes.

Arrays, die Namen als Indizes verwenden, werden assoziative Arrays (oder Hashes) genannt.

JavaScript unterstützt die Verwendung von Namen zum Indizieren von Arrays nicht; es erlaubt nur numerische Indizes.

Beispiel

var person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
var x = person.length;         // person.length gibt 3 zurück
var y = person[0];             // person

Selbst ausprobieren »

In JavaScript,ObjekteverwendenNamen als Indizes.。

Wenn Sie Namen als Indizes verwenden, wird JavaScript das Array beim Zugriff darauf als Standardobjekt neu definieren.

Nach dieser Operation sind die Methoden und Eigenschaften des Arrays nicht mehr verwendbar, andernfalls treten Fehler auf:

Beispiel

var person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
var x = person.length;         // person.length gibt 0 zurück
var y = person[0];             // person

Selbst ausprobieren »

Beim Definieren von Array-Elementen darf kein abschließendes Komma hinzugefügt werden

Das Hinzufügen eines Kommas nach dem letzten Wert eines Arrays ist syntaktisch in Ordnung, aber verschiedene Browser können unterschiedliche Ergebnisse liefern.

var colors = [5, 6, 7,]; //这样数组的长度可能为3 也可能为4.

Korrekte Vorgehensweise beim Definieren:

points = [40, 100, 1, 5, 25, 10];

Beim Definieren eines Objekts darf kein abschließendes Komma hinzugefügt werden

Inkorrekte Vorgehensweise beim Definieren:

websites = {site:"Example", url:"www.example.com", like:460,}

Korrekte Vorgehensweise beim Definieren:

websites = {site:"Example", url:"www.example.com", like:460}

Undefined ist nicht null

In JavaScript wirdnullfür Objekte verwendet,undefinedwird für Variablen, Eigenschaften und Methoden verwendet.

Ein Objekt kann nur null sein, wenn es definiert wurde; andernfalls ist es undefined.

Wenn wir testen möchten, ob ein Objekt existiert, wird ein Fehler ausgelöst, wenn das Objekt noch nicht definiert wurde.

Inkorrekte Verwendung:

if (myObj !== null && typeof myObj !== "undefined")

Der korrekte Weg ist, zuerst typeof zu verwenden, um zu prüfen, ob das Objekt definiert ist:

if (typeof myObj !== "undefined" && myObj !== null)

Blockgültigkeitsbereich

In jedem Codeblock erstellt JavaScript keinen neuen Gültigkeitsbereich; im Allgemeinen ist der Gültigkeitsbereich jedes Codeblocks global.

Die Variable i im folgenden Code gibt 10 zurück, nicht undefined:

Beispiel

for (var i = 0; i < 10; i++) {
    // some code
 }
return i;

Selbst ausprobieren »
Weitere Erweiterungen