Élévation en JavaScript
L'élévation est le comportement par défaut de JavaScript qui consiste à déplacer les déclarations en haut.
Les déclarations JavaScript sont élevé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.
Exemple 1 donne le même résultat que Exemple 2 :
Exemple 1
x = 5; // Assigner 5 à x
elem = document.getElementById("demo"); // Trouver un élément
elem.innerHTML = x; // Afficher x dans l'élément
var x; // Déclarer x Exemple 2
var x; // Déclarer x
x = 5; // Assigner 5 à x
elem = document.getElementById("demo"); // Trouver un élément
elem.innerHTML = x; // Afficher x dans l'élément
Pour comprendre cela, vous devez saisir le terme "élévation".
L'élévation est le comportement par défaut de JavaScript qui consiste à déplacer toutes les déclarations en haut de la portée actuelle (en 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 élevées en haut du bloc, mais ne sont pas initialisées .
Cela signifie que le bloc de code est conscient de la variable, mais elle ne peut pas être utilisée tant qu'elle n'a pas été déclarée.
Utiliser une variable let avant qu'elle ne soit déclarée entraînera une ReferenceError .
La variable se trouve dans une "zone morte temporelle" depuis le début du bloc jusqu'à ce qu'elle soit déclarée :
Exemple
Cela entraînera une ReferenceError : carName = "Volvo";
let carName; Utiliser une variable const 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 s'exécutera pas.
carName = "Volvo";
const carName; Lisez-en plus sur let et const dans JS Let / Const .
Les initialisations JavaScript ne sont pas élevées
JavaScript n'élève que les déclarations, pas les initialisations.
Exemple 1 ne donne pas le même résultat que Exemple 2 :
Exemple 1
var x = 5; // Initialiser x
var y = 7; // Initialiser y
elem = document.getElementById("demo"); // Trouver un élément
elem.innerHTML = x + " " + y; // Afficher x et y Exemple 2
var x = 5; // Initialiser x
elem = document.getElementById("demo"); // Trouver un élément
elem.innerHTML = x + " " + y; // Afficher x et y
var y = 7; // Initialiser y Est-ce que cela a du sens que y soit indéfini dans le dernier exemple ?
C'est parce que seule la déclaration (var y), et non l'initialisation (=7), est élevée en haut.
En raison de l'élévation, y a été déclarée avant d'être utilisée, mais comme les initialisations ne sont pas élevées, la valeur de y est indéfinie.
L'exemple 2 est équivalent à écrire :
Exemple
var x = 5; // Initialiser x
var y; // Déclarer y
elem = document.getElementById("demo"); // Trouver un élément
elem.innerHTML = x + " " + y; // Afficher x et y
y = 7; // Assigner 7 à y Déclarez vos variables en haut !
L'élévation est (pour de nombreux développeurs) un comportement inconnu ou négligé de JavaScript.
Si un développeur ne comprend pas l'élévation, 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 prochain chapitre.