JavaScript Common Errors

Dit hoofdstuk bespreekt enkele veelvoorkomende fouten in JavaScript.

Onverwacht gebruik van toewijzingsopters

Als de programmeur if Onverwachte gebruik van toewijzingsopters in=）in plaats van vergelijkingsopters (===）， JavaScript-programma's kunnen enkele onverwachte resultaten produceren.

Deze if De statement retourneert false（Zoals verwacht）， omdat x niet gelijk is aan 10:

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

Probeer het zelf

Deze if De statement retourneert true（Misschien niet zoals verwacht）， omdat 10 true is:

var x = 0;
if (x = 10)

Probeer het zelf

Deze if De statement retourneert false（Misschien niet zoals verwacht）， omdat 0 false is:

var x = 0;
if (x = 0)

Probeer het zelf

Toewijzing retourneert altijd de waarde van de toewijzing.

Verwachte losse vergelijking

In reguliere vergelijking is het type gegevens niet belangrijk. Deze if De statement retourneert true：

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

Probeer het zelf

In strikte vergelijking is het type gegevens echt belangrijk. Deze if De statement retourneert false：

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

Probeer het zelf

Een veelvoorkomende fout is vergeten om switch De statement gebruikt strikte vergelijking:

Deze switch De statement toont wel een dialoogvenster:

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

Probeer het zelf

Deze switch De statement toont geen dialoogvenster:

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

Probeer het zelf

Verwarrende optelling en cascading

OptellingVoorNumerieke。

Cascading (Concatenation)VoorString。

In JavaScript gebruiken beide berekeningen dezelfde + Bewerker.

Omdat vanwege dit, het optellen van getallen als getallen, en het optellen van getallen als strings, verschillende resultaten oplevert:

var x = 10 + 5;          // Het resultaat in x is 15
var x = 10 + "5";         // Het resultaat in x is "105"

Probeer het zelf

Als je twee variabelen optelt, is het moeilijk om het resultaat te voorspellen:

var x = 10;
var y = 5;
var z = x + y;            // Het resultaat in z is 15
var x = 10;
var y = "5";
var z = x + y;            // Het resultaat in z is "105"

Probeer het zelf

Misleidend floating point

Alle getallen in JavaScript worden opgeslagen als 64-bitsFloating-point numbers (Floats)。

All programming languages, including JavaScript, have difficulties in handling floating-point values:

var x = 0.1;
var y = 0.2;
var z = x + y             // The result in z will not be 0.3

Probeer het zelf

To solve the above problem, please use multiplication and division operations:

Voorbeeld

var z = (x * 10 + y * 10) / 10;       // The result in z will be 0.3

Probeer het zelf

Breaking lines in JavaScript strings

JavaScript allows you to break a statement into two lines:

Example 1

var x =
"Hello World!";

Probeer het zelf

But, it is not correct to break lines in the middle of a string:

Example 2

var x = "Hello
World!";

Probeer het zelf

Example 3

var x = "Hello \
World!";

Probeer het zelf

Misplaced semicolon

Because of a misplaced semicolon, this code block will always execute regardless of the value of x:

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

Probeer het zelf

Breaking lines in return statements

Automatically closing statements at the end of a line is the default JavaScript behavior.

That's why the following two examples return the same result:

Example 1

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

Probeer het zelf

Example 2

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

Probeer het zelf

JavaScript also allows you to break a statement into two lines.

That's why example 3 will also return the same result:

Example 3

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

Probeer het zelf

But, if you put return What happens if you break a statement into two lines:

Example 4

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

Probeer het zelf

This function will return undefined!

Why? Because JavaScript assumes that you mean:

Example 5

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

Probeer het zelf

Explanation

If a statement is incomplete:

var

JavaScript will complete this statement by reading the next line:

power = 10;

But because this statement is complete:

return

JavaScript will automatically close this statement:

return;

This happens because in JavaScript, using a semicolon to close (end) a statement is optional.

JavaScript closes at the end of the line return statement, because it is a complete statement itself.

So, never do to return statement is to break the line.

To access the array by using a named index

Vele programmeertalen ondersteunen array met genaamd geïndiceerde indices.

Array met genaamd geïndiceerde indices worden genoemd associative arrays (of hashes).

JavaScript Niet ondersteundArray met genaamd geïndiceerde indices

In JavaScript,ArrayGebruikNumerieke index：

Voorbeeld

var person = [];
person[0] = "Bill";
person[1] = "Gates";
person[2] = 46;
var x = person.length;          // person.length zal 3 retourneren
var y = person[0];              // person[0] zal "Bill" retourneren

Probeer het zelf

In JavaScript,ObjectenGebruikGenaamd geïndiceerd。

Als u genaamd geïndiceerde indices gebruikt, zal JavaScript het array opnieuw definiëren als een standaardobject bij het accesseren van het array.

Na automatische herdefinitie zullen arraymethoden of -eigenschappen ongedefinieerde of onjuiste resultaten opleveren：

Voorbeeld

var person = [];
person["firstName"] = "Bill";
person["lastName"] = "Gates";
person["age"] = 46;
var x = person.length;         // person.length zal 0 retourneren
var y = person[0];              // person[0] zal undefined retourneren

Probeer het zelf

Gebruik komma's om de definitie af te sluiten

Een trailing komma in object- en arraydefinities is in ECMAScript 5 toegestaan.

Object-instantie：

person = {firstName:"Bill", lastName:"Gates", age:62,}

Array-instantie：

points = [35, 450, 2, 7, 30, 16,];

WAARSCHUWING！！

Internet Explorer 8 zal crashen.

JSON staat geen trailing komma's toe.

JSON:

person = {firstName:"Bill", lastName:"Gates", age:62}

JSON:

points = [35, 450, 2, 7, 30, 16];

Undefined is niet Null

JavaScript-objecten, variabelen, eigenschappen en methoden kunnen ongedefinieerd zijn。

Daarnaast kan de waarde van een lege JavaScript-object zijn null。

Dit kan het testen of het object leeg is een beetje moeilijk maken。

U kunt controleren of het type undefined，om te testen of het object bestaat：

Voorbeeld

if (typeof myObj === "undefined")

Probeer het zelf

maar je kunt niet testen of het object nullomdat als het object undefined is, een fout wordt gegooid:

Onjuist:

if (myObj === null)

Om dit probleem op te lossen, moet je testen of het object nullin plaats van undefined.

maar dit zal nog steeds een fout veroorzaken:

Onjuist:

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

Daarom moet je eerst testen op undefined voordat je tests op niet null:

Correct:

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

Probeer het zelf

blockscope verwachten

JavaScript zal nietmaakt een nieuwe scope voor elke codeblok.

veel programmeertalen zijn zo, maar JavaScript Niet。

men denkt dat deze code teruggeeft undefinedis een常见错误：新 JavaScript ontwikkelaars：

Voorbeeld

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

Probeer het zelf