Errori comuni JavaScript

Questo capitolo indica alcuni errori comuni in JavaScript.

L'uso imprevisto dell'operatore di assegnamento

Se il programmatore usa if L'uso imprevisto dell'operatore di assegnazione nella=)) invece dell'operatore di confronto (=====)), i programmi JavaScript possono produrre alcuni risultati imprevisti.

Questa if La frase restituisce falseCome previsto), perché x non è uguale a 10:

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

Prova tu stesso

Questa if La frase restituisce trueForse non come previsto), perché 10 è true:

var x = 0;
if (x = 10)

Prova tu stesso

Questa if La frase restituisce falseForse non come previsto), perché 0 è false:

var x = 0;
if (x = 0)

Prova tu stesso

L'assegnazione sempre restituisce il valore assegnato.

Spero di confronti deboli

In confronti deboli, il tipo di dati non è importante. Questa if La frase restituisce true：

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

Prova tu stesso

In confronti rigorosi, il tipo di dati è davvero importante. Questa if La frase restituisce false：

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

Prova tu stesso

Un errore comune è dimenticare di switch La frase utilizza confronti rigorosi:

Questa switch La frase mostrerà la finestra di dialogo:

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

Prova tu stesso

Questa switch La frase non mostrerà la finestra di dialogo:

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

Prova tu stesso

Somma e concatenazione ingannevoli

SommaPerNumerico。

Concatenazione (Concatenation)PerStringa。

In JavaScript, entrambi gli operatori utilizzano lo stesso + Operatore.

Per questo, sommare numeri come numeri produce risultati diversi da sommarli come stringhe:

var x = 10 + 5;          // Il risultato in x è 15
var x = 10 + "5";         // Il risultato in x è "105"

Prova tu stesso

Se si sommano due variabili, è difficile prevedere il risultato:

var x = 10;
var y = 5;
var z = x + y;            // Il risultato in z è 15
var x = 10;
var y = "5";
var z = x + y;            // Il risultato in z è "105"

Prova tu stesso

Il punto fluttuante ingannevole

Tutti i numeri in JavaScript vengono salvati come 64 bitNumeri a virgola mobile (Floats)。

Tutti i linguaggi di programmazione, inclusi JavaScript, hanno difficoltà a gestire i valori a virgola mobile:

var x = 0.1;
var y = 0.2;
var z = x + y             // Il risultato in z non sarà 0.3

Prova tu stesso

Per risolvere il problema sopra, usa le operazioni di moltiplicazione e divisione:

Esempio

var z = (x * 10 + y * 10) / 10;       // Il risultato in z sarà 0.3

Prova tu stesso

Nuova riga di comando per stringhe JavaScript

JavaScript ti permette di spezzare una frase in due righe:

Esempio 1

var x =
"Hello World!";

Prova tu stesso

Ma, fare una nuova riga di comando nel mezzo di una stringa non è corretto:

Esempio 2

var x = "Hello
World!";

Prova tu stesso

Esempio 3

var x = "Hello \",
World!";

Prova tu stesso

Punto e virgola fuori posto

Per un punto e virgola sbagliato, questo blocco di codice eseguirà sempre indipendentemente dal valore di x:

if (x == 19);
{
     // blocco di codice
}

Prova tu stesso

Fai una nuova riga di comando per il comando return

Chiudere automaticamente le frasi alla fine della riga è il comportamento predefinito di JavaScript.

Ecco perché i due esempi seguenti restituiscono lo stesso risultato:

Esempio 1

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

Prova tu stesso

Esempio 2

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

Prova tu stesso

JavaScript ti permette anche di spezzare una frase in due righe.

Ecco perché l'esempio 3 restituirà lo stesso risultato:

Esempio 3

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

Prova tu stesso

Ma, se si mette return Cosa succede se si cambia riga di comando per due righe?

Esempio 4

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

Prova tu stesso

Questa funzione restituirà undefined!

Perché? Perché JavaScript pensa che tu voglia:

Esempio 5

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

Prova tu stesso

Spiegazione

Se una frase non è completa:

var

JavaScript completerà questa frase leggendo la riga successiva:

power = 10;

Ma poiché questa frase è completa:

return

JavaScript chiuderà automaticamente questa frase:

return;

Questo accade perché, in JavaScript, chiudere (terminare) una frase con un punto e virgola è opzionale.

JavaScript chiude automaticamente return una frase, perché è già una frase completa.

Quindi, non dovresti mai return Esegui una nuova riga di comando.

Accedi all'array tramite l'indice di nome

很多编程语言支持带有命名索引的数组。

带有命名索引的数组被称为关联数组（或散列）。

JavaScript 不支持带有命名索引的数组。

在 JavaScript 中，数组使用数字索引：

Esempio

var person = [];
person[0] = "Bill";
person[1] = "Gates";
person[2] = 46;
var x = person.length;          // person.length 将返回 3
var y = person[0];              // person[0] 将返回 "Bill"

Prova tu stesso

在 JavaScript 中，对象使用命名索引。

如果您使用命名索引，那么在访问数组时，JavaScript 会将数组重新定义为标准对象。

在自动重定义之后，数组方法或属性将产生未定义或非正确的结果：

Esempio

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

Prova tu stesso

用逗号来结束定义

对象和数组定义中的尾随逗号在 ECMAScript 5 中是合法的。

对象实例：

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

数组实例：

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

警告！！

Internet Explorer 8 会崩溃。

JSON 不允许尾随逗号。

JSON:

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

JSON:

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

Undefined 不是 Null

JavaScript 对象、变量、属性和方法可以是未定义的。

此外，空的 JavaScript 对象的值可以为 null。

这可能会使测试对象是否为空变得有点困难。

您可以通过测试类型是否为 undefined，测试对象是否存在：

Esempio

if (typeof myObj === "undefined")

Prova tu stesso

Ma non puoi testare se l'oggetto è nullperché se l'oggetto è undefined, verrà lanciato un errore:

Errato:

if (myObj === null)

Per risolvere questo problema, devi testare se l'oggetto è nullinvece di undefined.

Ma questo ancora causerebbe un errore:

Errato:

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

Quindi, prima di testare non null, devi testare undefined:

Corretto:

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

Prova tu stesso

aspetta un contesto di blocco

JavaScript noncrea un nuovo contesto di scope per ogni blocco di codice.

Molti linguaggi di programmazione lo fanno, ma JavaScript Non è così。

pensare che questo codice restituirà undefinedè un errore comune dei nuovi sviluppatori JavaScript:

Esempio

for (var i = 0; i < 10; i++) {
  // Blocco di codice
}
return i;

Prova tu stesso