JavaScript Almindelige fejl

本章指出一些常见的JavaScript错误。

意外使用赋值运算符

如果程序员在 if 语句中意外使用赋值运算符（=）而不是比较运算符（===），JavaScript程序可能会产生一些无法预料的结果。

这条 if 语句返回 false（正如预期），因为x不等于10：

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

Prøv det selv

这条 if 语句返回 true（也许不像预期），因为10为true：

var x = 0;
if (x = 10)

Prøv det selv

这条 if 语句返回 false（也许不像预期），因为0为false：

var x = 0;
if (x = 0)

Prøv det selv

赋值总是返回赋值的值。

期望松散的比较

在常规比较中，数据类型不重要。这条 if 语句返回 true:

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

Prøv det selv

在严格比较中，数据类型确实重要。这条 if 语句返回 false:

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

Prøv det selv

有一个常见的错误是忘记在 switch 语句中使用严格比较：

这条 switch 语句会显示提示框：

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

Prøv det selv

这条 switch 语句不会显示提示框：

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

Prøv det selv

令人困惑的加法和级联

加法用于加数值.

级联（Concatenation）用于加字符串.

在JavaScript中，这两种运算均使用相同的 + 运算符。

正因如此，将数字作为数值相加，与将数字作为字符串相加，将产生不同的结果：

var x = 10 + 5;          // x中的结果是 15
var x = 10 + "5";         // x中的结果是 "105"

Prøv det selv

如果是两个变量相加，很难预测结果：

var x = 10;
var y = 5;
var z = x + y;            // z中的结果是 15
var x = 10;
var y = "5";
var z = x + y;            // z中的结果是 "105"

Prøv det selv

令人误解的浮点

JavaScript中的数字均保存为64位的Flydende tal (Floats).

Alle programmeringssprog, herunder JavaScript, har det med at håndtere flydende værdier:

var x = 0.1;
var y = 0.2;
var z = x + y             // Resultatet i z vil ikke være 0.3

Prøv det selv

For at løse problemet, brug multiplikation og division:

eksempel

var z = (x * 10 + y * 10) / 10;       // Resultatet i z vil være 0.3

Prøv det selv

Linjeskift af JavaScript-strenger

JavaScript tillader dig at linjeskifte en kommando til to linjer:

Eksempel 1

var x =
"Hello World!";

Prøv det selv

Men det er forkert at linjeskifte i midten af en streng:

Eksempel 2

var x = "Hello
World!";

Prøv det selv

Hvis der skal linjeskiftes i en streng, skal der bruges omvendt skråstreg:

Eksempel 3

var x = "Hello ",
World!";

Prøv det selv

Forkludt semikolon

På grund af et forkert semikolon vil denne kodeblok uanset x's værdi altid blive udført:

if (x == 19);
{
     // kodeblok
}

Prøv det selv

Linjeskift af return-kommandoer

At lukke kommandoer automatisk ved linjeskift er standardopførsel i JavaScript.

Dette er grunden til, at de to følgende eksempler returnerer det samme resultat:

Eksempel 1

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

Prøv det selv

Eksempel 2

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

Prøv det selv

JavaScript tillader også at linjeskifte en kommando til to linjer.

Dette er grunden til, at eksempel 3 også vil returnere det samme resultat:

Eksempel 3

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

Prøv det selv

Men hvis man return Hvad sker der, hvis man linjeskifter kommandoer til to linjer?

Eksempel 4

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

Prøv det selv

Denne funktion vil returnere undefined!

Hvorfor? Fordi JavaScript antager, at du mener:

Eksempel 5

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

Prøv det selv

forklaring

Hvis en kommando er ufuldstændig:

var

JavaScript vil fuldføre denne kommando ved at læse næste linje:

power = 10;

Men fordi denne kommando er fuldstændig:

return

JavaScript lukker automatisk denne kommando:

return;

Dette sker, fordi i JavaScript er det valgfrit at bruge semikolon til at afslutte (lukke) kommandoer.

JavaScript lukker automatisk return kommando, fordi det allerede er en fuldstændig kommando.

Så aldrig på return kommandoer linjeskift.

Gennem at navngive indekser kan man tilgå arrayet

Mange programmeringssprog understøtter array med navngivne indekser.

Array med navngivne indekser kaldes associative arrayer (eller hashboards).

JavaScript Ikke understøttetArray med navngivne indekser.

I JavaScript:ArrayBrugNumeriske indekser:

eksempel

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

Prøv det selv

I JavaScript:ObjekterBrugNavngivne indekser.

Hvis du bruger navngivne indekser, vil JavaScript omdefinere arrayet til et standardobjekt, når du adgang til arrayet.

Efter automatisk omdefinering vil arraymetoder eller egenskaber generere udefinerede eller forkerte resultater:

eksempel

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

Prøv det selv

Brug komma til at afslutte definitionen

Afluttende kommaer i objekt- og arraydefineringer er gyldige i ECMAScript 5.

Objekt-instans:

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

Array-instans:

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

Advarsel！！

Internet Explorer 8 vil krasje.

JSON tillader ikke afsluttende kommaer.

JSON:

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

JSON:

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

Undefineret er ikke Null

JavaScript-objekter, variabler, egenskaber og metoder kan være udefinerede.

Derfor kan værdien af en tom JavaScript-objekt være null.

Dette kan gøre det lidt svært at teste om testobjektet er tomt.

Du kan teste om typen er undefinedFor at teste om objektet eksisterer:

eksempel

if (typeof myObj === "undefined")

Prøv det selv

men du kan ikke teste, om objektet er nullfordi hvis objektet er undefined, vil det kaste en fejl:

Forkert:

if (myObj === null)

For at løse dette problem skal du teste, om objektet er nulli stedet for "undefined".

men dette vil stadig forårsage en fejl:

Forkert:

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

Derfor skal du teste for "undefined" først, før du tester for ikke null:

Korrekt:

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

Prøv det selv

forventer blokvisning

JavaScript ikkeopretter en ny rækkevisning for hver kodeblok.

Mange programmeringssprog er sådan, men JavaScript Ikke sandt.

at tro, at denne kode vil returnere undefineder en almindelig fejl for nye JavaScript-udviklere:

eksempel

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

Prøv det selv