Erreurs JavaScript
Ce chapitre signale quelques erreurs JavaScript courantes.
Utilisation accidentelle de l’opérateur d’affectation
Les programmes JavaScript peuvent générer des résultats inattendus si un programmeur utilise accidentellement un opérateur d’affectation (=), au lieu d’un opérateur de comparaison (==) dans une instruction if.
Ce if déclaration renvoie false (comme prévu) car x n’est pas égal à 10 :
Ce if déclaration renvoie true (peut-être pas comme prévu), car 10 est vrai :
Ce if déclaration renvoie false (peut-être pas comme prévu), car 0 est faux :
Une affectation renvoie toujours la valeur de l’affectation.
S’attendre à une comparaison lâche
En comparaison régulière, le type de données n’a pas d’importance. Ce if l’instruction renvoie vrai :
En comparaison stricte, le type de données est important. Ce if l’instruction renvoie faux :
C’est une erreur commune d’oublier que switch les instructions utilisent une comparaison stricte :
Ce case switch affichera une alerte :
Ce case switch n’affichera pas d’alerte :
Addition et concaténation déroutantes
Ajout consiste à ajouter Nombres.
Enchaînement consiste à ajouter cordes.
En JavaScript, les deux opérations utilisent le même + opérateur.
Pour cette raison, l’ajout d’un nombre en tant que nombre produira un résultat différent de l’ajout d’un nombre en tant que chaîne :
soit x = 10 ;
x = 10 + 5 ; // Maintenant x vaut 15
soit y = 10 ;
y += “5” ; // Maintenant y vaut “105”
Essayez-le vous-même »
Lors de l’addition de deux variables, il peut être difficile d’anticiper le résultat :
soit x = 10 ;
soit y = 5 ;
soit z = x + y ; // Maintenant z vaut 15
soit x = 10 ;
soit y = “5” ;
soit z = x + y ; // Maintenant z vaut “105”
Essayez-le vous-même »
Flotteurs mal compris
Tous les nombres en JavaScript sont stockés en 64 bits Nombres à virgule flottante
(Flotteurs).
Tous les langages de programmation, y compris JavaScript, ont des difficultés avec des valeurs à virgule flottante précises :
soit x = 0,1 ;
soit y = 0,2 ;
soit z = x + y // le résultat en z ne sera pas 0,3
Essayez-le vous-même »
Pour résoudre le problème ci-dessus, il est utile de multiplier et de diviser :
Casser une chaîne JavaScript
JavaScript vous permettra de diviser une déclaration en deux lignes :
Mais casser une instruction au milieu d’une chaîne ne fonctionnera pas :
Vous devez utiliser une “barre oblique inverse” si vous devez casser une instruction dans une chaîne :
Point-virgule mal placé
En raison d’un point-virgule mal placé, ce bloc de code s’exécutera quelle que soit la valeur de x :
Briser une déclaration de retour
C’est un comportement JavaScript par défaut pour fermer automatiquement une instruction à la fin d’une ligne.
Pour cette raison, ces deux exemples renverront le même résultat :
Exemple 1
function maFonction(a) {
soit puissance = 10
renvoie une puissance *
}
Essayez-le vous-même »
Exemple 2
function maFonction(a) {
soit puissance = 10 ;
renvoie une puissance * ;
}
Essayez-le vous-même »
JavaScript vous permettra également de diviser une déclaration en deux lignes.
Pour cette raison, l’exemple 3 renverra également le même résultat :
Exemple 3
function maFonction(a) {
laisser
puissance = 10 ;
renvoie une puissance * ;
}
Essayez-le vous-même »
Mais que se passera-t-il si vous cassez l’instruction return en deux lignes comme ceci :
Exemple 4
function maFonction(a) {
laisser
puissance = 10 ;
retour
un pouvoir;
}
Essayez-le vous-même »
La fonction retournera undefined!
Pourquoi? Parce que JavaScript pensait que vous vouliez dire :
Exemple 5
function maFonction(a) {
laisser
puissance = 10 ;
retour;
un pouvoir;
}
Essayez-le vous-même »
Explication
Si une déclaration est incomplète comme :
JavaScript essaiera de compléter l’instruction en lisant la ligne suivante :
Mais puisque cette déclaration est complète :
JavaScript le fermera automatiquement comme ceci :
Cela se produit car les instructions de fermeture (de fin) avec un point-virgule sont facultatives en JavaScript.
JavaScript fermera l’instruction de retour à la fin de la ligne, car il s’agit d’une instruction complète.
Ne cassez jamais une instruction de retour.
Accéder aux tableaux avec des index nommés
De nombreux langages de programmation prennent en charge les tableaux avec des index nommés.
Les tableaux avec des index nommés sont appelés tableaux associatifs (ou hachages).
JavaScript fait pas prennent en charge les tableaux avec des index nommés.
En JavaScript, tableaux utiliser index numérotés:
Exemple
const personne = [];
personne[0] = “Jean” ;
personne[1] = “Biche” ;
personne[2] = 46 ;
personne.longueur ; // person.length retournera 3
personne[0]; // personne[0] renverra “John”
Essayez-le vous-même »
En JavaScript, objets utiliser index nommés.
Si vous utilisez un index nommé, lors de l’accès à un tableau, JavaScript redéfinit le tableau en un objet standard.
Après la redéfinition automatique, les méthodes et propriétés de tableau produiront des résultats indéfinis ou incorrects :
Exemple:
const personne = [];
personne[“firstName”] = “Jean” ;
personne[“lastName”] = “Biche” ;
personne[“age”] = 46 ;
personne.longueur ; // personne.longueur renverra 0
personne[0]; // personne[0] renverra indéfini
Essayez-le vous-même »
Terminer les définitions par une virgule
Les virgules de fin dans la définition d’objet et de tableau sont légales dans ECMAScript 5.
Exemple d’objet :
personne = {firstName:”John”, lastName:”Doe”, age:46,}
Exemple de tableau :
points = [40, 100, 1, 5, 25, 10,];
AVERTISSEMENT !!
Internet Explorer 8 va planter.
JSON n’autorise pas les virgules de fin.
JSON :
personne = {“firstName”:”John”, “lastName”:”Doe”, “age”:46}
JSON :
points = [40, 100, 1, 5, 25, 10];
Non défini n’est pas nul
Les objets, variables, propriétés et méthodes JavaScript peuvent être undefined.
De plus, les objets JavaScript vides peuvent avoir la valeur null.
Cela peut rendre un peu difficile de tester si un objet est vide.
Vous pouvez tester si un objet existe en testant si le type est undefined:
Mais vous ne pouvez pas tester si un objet est nullcar cela générera une erreur si l’objet est undefined:
Incorrect:
si (monObj === null)
Pour résoudre ce problème, vous devez tester si un objet n’est pas nullet pas undefined.
Mais cela peut toujours générer une erreur :
Incorrect:
if (myObj !== null && typeof myObj !== “undefined”)
Pour cette raison, vous devez tester pour ne pas undefined avant de pouvoir tester non null:
#Erreurs #JavaScript