Levage JavaScript
Le levage est le comportement par défaut de JavaScript pour déplacer les déclarations vers le haut.
Les déclarations JavaScript sont hissées
En JavaScript, une variable peut être déclarée après avoir été utilisée.
En d'autres termes; une variable peut être utilisée avant d'avoir été déclarée.
L' exemple 1 donne le même résultat que l' exemple 2 :
Exemple 1
x = 5; // Assign 5 to x
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x;
// Display x in the element
var x; // Declare x
Exemple 2
var x; // Declare x
x = 5; // Assign 5 to x
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x;
// Display x in the element
Pour comprendre cela, vous devez comprendre le terme "levage".
Le levage est le comportement par défaut de JavaScript consistant à déplacer toutes les déclarations vers le haut de la portée actuelle (vers le haut du script actuel ou de la fonction actuelle).
Les mots-clés let et const
Les variables définies avec let
et const
sont hissées en haut du bloc, mais pas initialisées .
Signification : Le bloc de code connaît la variable, mais elle ne peut pas être utilisée tant qu'elle n'a pas été déclarée.
L'utilisation d'une let
variable avant qu'elle ne soit déclarée entraînera un
ReferenceError
.
La variable est dans une "zone morte temporelle" depuis le début du bloc jusqu'à ce qu'elle soit déclarée :
Exemple
Cela se traduira par unReferenceError
:
carName = "Volvo";
let carName;
L'utilisation d'une const
variable avant qu'elle ne soit déclarée est une erreur de syntaxe, donc le code ne s'exécutera tout simplement pas.
Exemple
Ce code ne fonctionnera pas.
carName = "Volvo";
const carName;
En savoir plus sur let et const dans JS Let / Const .
Les initialisations JavaScript ne sont pas hissées
JavaScript ne hisse que les déclarations, pas les initialisations.
L' exemple 1 ne donne pas le même résultat que l' exemple 2 :
Exemple 1
var x = 5; // Initialize x
var y = 7; // Initialize y
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y; // Display x and y
Exemple 2
var x = 5; // Initialize x
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y; // Display x and y
var y = 7; // Initialize y
Est-il logique que y soit indéfini dans le dernier exemple ?
En effet, seule la déclaration (var y), et non l'initialisation (=7) est hissée au sommet.
En raison du hissage, y a été déclaré avant d'être utilisé, mais comme les initialisations ne sont pas hissées, la valeur de y est indéfinie.
L'exemple 2 revient au même que d'écrire :
Exemple
var x = 5; // Initialize x
var y; // Declare y
elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y; // Display x and y
y = 7; // Assign 7 to y
Déclarez vos variables en haut !
Le levage est (pour de nombreux développeurs) un comportement inconnu ou négligé de JavaScript.
Si un développeur ne comprend pas le levage, les programmes peuvent contenir des bogues (erreurs).
Pour éviter les bogues, déclarez toujours toutes les variables au début de chaque portée.
Puisque c'est ainsi que JavaScript interprète le code, c'est toujours une bonne règle.
JavaScript en mode strict n'autorise pas l'utilisation de variables si elles ne sont pas déclarées.
Étudiez "use strict" dans le chapitre suivant.