Errori comuni JavaScript
Questo capitolo evidenzia alcuni errori JavaScript comuni.
Utilizzo accidentale dell'operatore di assegnazione
I programmi JavaScript possono generare risultati imprevisti se un programmatore utilizza accidentalmente un operatore di assegnazione ( =), invece di un operatore di confronto ( ==) in un'istruzione if.
Questa ifistruzione restituisce false(come previsto) perché x non è uguale a 10:
let x = 0;
if (x == 10)
Questa ifaffermazione restituisce true(forse non come previsto), perché 10 è vero:
let x = 0;
if (x = 10)
Questa ifistruzione restituisce false(forse non come previsto), perché 0 è falso:
let x = 0;
if (x = 0)
Un'assegnazione restituisce sempre il valore dell'assegnazione.
Aspettando un confronto allentato
Nel confronto regolare, il tipo di dati non ha importanza. Questa ifaffermazione restituisce vero:
let x = 10;
let y = "10";
if (x == y)
In un confronto rigoroso, il tipo di dati è importante. Questa ifaffermazione restituisce falso:
let x = 10;
let y = "10";
if (x === y)
È un errore comune dimenticare che switchle affermazioni usano il confronto rigoroso:
Verrà case switchvisualizzato un avviso:
let x = 10;
switch(x) {
case 10: alert("Hello");
}
Questo case switchnon visualizzerà un avviso:
let x = 10;
switch(x) {
case "10": alert("Hello");
}
Aggiunta e concatenazione confuse
L'addizione riguarda l'addizione di numeri .
La concatenazione riguarda l'aggiunta di stringhe .
In JavaScript entrambe le operazioni utilizzano lo stesso +operatore.
Per questo motivo, l'aggiunta di un numero come numero produrrà un risultato diverso dall'aggiunta di un numero come stringa:
let x = 10;
x = 10 + 5; //
Now x is 15
let y = 10;
y += "5";
// Now y is "105"
Quando si aggiungono due variabili, può essere difficile anticipare il risultato:
let x = 10;
let y = 5;
let z = x + y; // Now z is 15
let x = 10;
let y = "5";
let z = x + y; // Now z is "105"
Galleggianti incomprensibili
Tutti i numeri in JavaScript vengono memorizzati come numeri in virgola mobile a 64 bit (float).
Tutti i linguaggi di programmazione, incluso JavaScript, hanno difficoltà con valori a virgola mobile precisi:
let x = 0.1;
let y = 0.2;
let z = x + y
// the result in z will not be 0.3
Per risolvere il problema di cui sopra, è utile moltiplicare e dividere:
Esempio
let z = (x * 10 + y * 10) / 10; // z will be 0.3
Rompere una stringa JavaScript
JavaScript ti consentirà di suddividere un'istruzione in due righe:
Esempio 1
let x =
"Hello World!";
Ma rompere un'istruzione nel mezzo di una stringa non funzionerà:
Esempio 2
let x = "Hello
World!";
Devi usare una "barra rovesciata" se devi interrompere un'istruzione in una stringa:
Esempio 3
let x = "Hello \
World!";
Punto e virgola errato
A causa di un punto e virgola fuori posto, questo blocco di codice verrà eseguito indipendentemente dal valore di x:
if (x == 19);
{
// code block
}
Rompere una dichiarazione di ritorno
È un comportamento JavaScript predefinito per chiudere automaticamente un'istruzione alla fine di una riga.
Per questo motivo, questi due esempi restituiranno lo stesso risultato:
Esempio 1
function myFunction(a) {
let power = 10
return a * power
}
Esempio 2
function myFunction(a) {
let power = 10;
return a * power;
}
JavaScript ti consentirà anche di spezzare un'istruzione in due righe.
Per questo motivo, anche l'esempio 3 restituirà lo stesso risultato:
Esempio 3
function myFunction(a) {
let
power = 10;
return a * power;
}
Ma cosa accadrà se rompi la dichiarazione di ritorno in due righe come questa:
Esempio 4
function myFunction(a) {
let
power = 10;
return
a * power;
}
La funzione tornerà undefined!
Come mai? Perché JavaScript pensava che tu intendessi:
Esempio 5
function myFunction(a) {
let
power = 10;
return;
a * power;
}
Spiegazione
Se una dichiarazione è incompleta come:
let
JavaScript proverà a completare la dichiarazione leggendo la riga successiva:
power = 10;
Ma poiché questa affermazione è completa:
return
JavaScript lo chiuderà automaticamente in questo modo:
return;
Ciò accade perché la chiusura di istruzioni (finali) con punto e virgola è facoltativa in JavaScript.
JavaScript chiuderà l'istruzione return alla fine della riga, perché è un'istruzione completa.
Non rompere mai una dichiarazione di reso.
Accesso agli array con indici denominati
Molti linguaggi di programmazione supportano array con indici denominati.
Gli array con indici denominati sono chiamati array associativi (o hash).
JavaScript non supporta gli array con indici denominati.
In JavaScript, gli array utilizzano indici numerati :
Esempio
const person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
person.length;
// person.length will return 3
person[0];
// person[0] will return "John"
In JavaScript, gli oggetti utilizzano gli indici denominati .
Se utilizzi un indice denominato, quando accedi a un array, JavaScript ridefinirà l'array in un oggetto standard.
Dopo la ridefinizione automatica, i metodi e le proprietà dell'array produrranno risultati non definiti o errati:
Esempio:
const person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
person.length; // person.length will
return 0
person[0];
// person[0] will return undefined
Conclusione delle definizioni con una virgola
Le virgole finali nella definizione di oggetto e matrice sono consentite in ECMAScript 5.
Esempio di oggetto:
person = {firstName:"John", lastName:"Doe", age:46,}
Esempio di matrice:
points = [40, 100, 1, 5, 25, 10,];
AVVERTIMENTO !!
Internet Explorer 8 andrà in crash.
JSON non consente virgole finali.
JSON:
person = {"firstName":"John", "lastName":"Doe", "age":46}
JSON:
points = [40, 100, 1, 5, 25, 10];
Undefined non è nullo
Gli oggetti, le variabili, le proprietà e i metodi JavaScript possono essere undefined.
Inoltre, gli oggetti JavaScript vuoti possono avere il valore null.
Questo può rendere un po' difficile verificare se un oggetto è vuoto.
You can test if an object exists by testing if the type is undefined:
Example:
if (typeof myObj === "undefined")
But you cannot test if an object is null, because this will throw an error if the
object is undefined:
Incorrect:
if (myObj === null)
To solve this problem, you must test if an object is not null,
and not undefined.
But this can still throw an error:
Incorrect:
if (myObj !== null && typeof myObj
!== "undefined")
Because of this, you must test for not undefined before you can
test for not null:
Correct:
if (typeof myObj !== "undefined" && myObj !== null)