Qu'est-ce que le levage est un JavaScript ?

Le levage fait référence au processus en JavaScript où les déclarations sont faites avant l'exécution. Les déclarations de variables et de fonctions sont traitées en premier. Par conséquent, même si une variable est référencée avant sa déclaration, elle ne provoquera pas d’erreur, mais renverra plutôt undéfini. Pour les déclarations de fonction, la fonction entière est hissée, ce qui signifie qu'elle peut être utilisée avant d'être définie dans le code. Ce processus place les déclarations dans la pile avant le début de l'exécution.

En termes plus simples :

• Les variables déclarées avec var sont initialisées comme non définies lors du levage.

• Les déclarations de fonctions sont entièrement hissées et peuvent être appelées avant d'être écrites dans le code.

• Le processus de levage garantit que ces déclarations sont reconnues dans la pile d'exécution, quelle que soit leur position dans le code.

Il est important de noter que seules les déclarations sont levées, pas les affectations. Les devoirs restent au même endroit où vous les avez rédigés.

Remarque : Ceux qui disent que lors du levage, le code se déplace vers le haut se trompent en réalité. Le code ne monte jamais.

Exemple:

console.log(myVariable); // undefined      
var myVariable = 10;

Ce code effectue deux actions simultanément. Tout d'abord, il déclare la variable myVariable et la hisse dans la portée, mais sa valeur n'est toujours pas définie. Par conséquent, la commande console.log affiche la valeur non initialisée comme étant indéfinie. Après cela, la valeur 10 est attribuée à myVariable.

Cependant, si vous essayez de le modifier, cela n'aura aucun effet sur la déclaration précédente. Par exemple:

console.log(myVariable); // ReferenceError: myVariable is not defined      
myVariable = 10;

Ici, nous n'avons pas déclaré la variable myVariable, elle renvoie donc une ReferenceError avant de tenter de la modifier.

En résumé, JavaScript lit d'abord tout le code, puis lève toutes les déclarations tout en conservant les affectations dans leurs positions d'origine. Ce processus est connu sous le nom de levage.

var et let sont également hissés :

Var et let sont tous deux hissés en JavaScript, mais leur comportement est légèrement différent.

variable :

Lorsque vous déclarez une variable à l'aide de var, sa déclaration est hissée hors de la portée et vous pouvez accéder à la variable avant sa déclaration, mais sa valeur sera indéfinie jusqu'à ce qu'une valeur lui soit attribuée.

Exemple:

console.log(myVariable); // undefined
var myVariable = 10;

Dans le code ci-dessus, la déclaration var myVariable est hissée hors de la portée, mais l'affectation myVariable = 10 est laissée en place. Par conséquent, l'instruction console.log génère un résultat indéfini car la variable existe mais n'a pas encore reçu de valeur.

laisser:

D'un autre côté, lorsque vous déclarez une variable en utilisant let, le comportement de levage est un peu différent. La déclaration de variable est levée, mais vous ne pouvez pas accéder à la variable avant sa déclaration. C'est ce qu'on appelle la « zone morte temporelle ». Si vous essayez d'accéder à une variable let avant sa déclaration, vous obtiendrez une ReferenceError.

Exemple:

console.log(myVariable); // ReferenceError: myVariable is not defined
let myVariable = 10;

Dans ce cas, la déclaration est levée, mais la variable n'est pas accessible avant sa déclaration. Par conséquent, l'instruction console.log renvoie une ReferenceError car la variable n'a pas encore été définie.

Ici fondamentalement dans le cas de let, même si elle est levée, la valeur de la variable reste indéfinie. Parce qu'il n'y a pas d'espace en mémoire pour cette variable. Pour cette raison, je ne peux pas faire référence à cette adresse. Comme il n'y a pas d'adresse de myVariable = 10 dans la mémoire, cela donne une erreur de référence.

const :

Le mot-clé const vous permet de créer des constantes, qui sont des variables qui ne peuvent pas être réaffectées une fois qu'une valeur leur est attribuée.

Exemple : 1

const PI = 3.142;
PI = 22/7; // Attempt to reassign the value of PI
console.log(PI); // Output: TypeError: Assignment to constant variable

Dans cet exemple, nous définissons PI it comme une constante avec une valeur initiale de 3,142. Lorsque nous essayons de réattribuer une nouvelle valeur à PI, une TypeError est générée car les constantes ne peuvent pas être réaffectées.

Exemple : 2

const PI;
console.log(PI); // Output: SyntaxError: Missing initializer in const declaration
PI = 3.142;

Dans ce cas, nous déclarons un PI constant sans l'initialiser. Ce code renvoie une SyntaxError car les constantes doivent être déclarées et initialisées en même temps.

Exemple : 3

function getCircumference(radius) {
  console.log(circumference);
  circumference = PI * radius * 2;
  const PI = 22/7;
}
getCircumference(2); // ReferenceError: circumference is not defined

Ici, dans la fonction getCircumference, nous essayons d'accéder à la circonférence avant sa déclaration. Il renvoie une ReferenceError car la variable n'est pas encore définie.

Lors de l'utilisation de const, il est nécessaire de déclarer et d'initialiser la variable avant de l'utiliser.

Dans l'ensemble, var et let sont tous deux hissés en JavaScript, mais leur comportement et le concept de zone morte temporelle ne s'appliquent qu'aux variables let. const crée des constantes qui ne peuvent pas être réaffectées une fois initialisées.

Toutes les variables non déclarées sont des variables globales :

function hoisted() {
a = 20;
var b = 100;
}
hoisted();
console.log(a); // 20
// can be accessed as a global variable outside the hoisted() function.

console.log(b);
// As it is declared, it is bound within the bounds of the hoisted() function. We cannot print it outside the hoisted() function.
output: ReferenceError: b is not defined

Variables étendues à la fonction

Nous pouvons voir que la déclaration de la variable de message var dans le cadre de la fonction hoist() va en haut de la fonction.
Pour éviter ce problème, nous veillerons à déclarer la variable avant de l'utiliser.

Dans les deux exemples que vous avez fournis, le résultat ne sera pas défini.

Exemple : 1

function hoist() {
  console.log(message);
  var message = 'Hoisting is all the rage!';
}
hoist(); // Output: undefined

Exemple : 2

function hoist() {
  var message;
  console.log(message);
  message = 'Hoisting is all the rage!';
}

hoist(); // Output: undefined

Dans les deux cas, la sortie n'est pas définie car les variables sont hissées au sommet de leurs portées respectives mais leur affectation se produit ensuite dans l'ordre d'origine du code.

Expressions de fonction

Les expressions de fonction ne sont pas levées et renvoient une TypeError car l'expression est traitée comme une variable et non comme une fonction.

expression(); // Output: "TypeError: expression is not a function
var expression = function() {
  console.log('Will this work?');
};

Mode strict

De par son nom, il s'agit d'une variante restreinte de JavaScript qui ne tolérera pas l'utilisation de variables avant qu'elles ne soient déclarées. Exécuter notre code en mode strict :

• Élimine certaines erreurs JavaScript silencieuses en les remplaçant par des erreurs de lancement explicites.

• Corrige les erreurs qui rendent difficile l'optimisation des moteurs JavaScript.

• Vous risquez de ne pas avoir déclaré la variable, utilisez strict qui vous a arrêté en lançant une erreur de référence.
  

'use strict';

console.log(hoist); // Output: ReferenceError: hoist is not defined
hoist = 'Hoisted';

Conclusion

Il est important de comprendre le levage en JavaScript lors de la déclaration de variables et de fonctions. Au fur et à mesure que le levage est expliqué, vous comprendrez comment le code JavaScript est réellement géré.