Mystère du levage en JavaScript !

JavaScript regorge de bizarreries, et le levage fait partie de celles qui ont tendance à dérouter les nouveaux arrivants. Mais ne vous inquiétez pas à la fin de cet article, vous aurez une compréhension claire du levage, simplifié !

Qu’est-ce que le levage ? ?

À la base, le levage est le comportement par défaut de JavaScript consistant à déplacer les déclarations vers le haut de leur portée. Cela ne signifie pas que le code est physiquement réorganisé, mais simplement la façon dont le moteur JavaScript l'interprète.

Pensez-y de cette façon : avant que JavaScript ne commence à exécuter votre code, il se "prépare" en allouant de la mémoire à toutes les variables et fonctions à l'avance, avant même qu'une seule ligne de code ne soit exécutée.

Mythes courants sur le levage

Seules les variables sont hissées.
?? Ce n'est pas vrai
Les déclarations de fonctions et les déclarations de variables sont levées.

Les variables hissées sont initialisées automatiquement.
?? Encore faux
Les variables sont hissées mais pas initialisées. Leur valeur reste indéfinie jusqu'à ce qu'elle soit explicitement attribuée.

Comprendre le levage avec des exemples ?

1. Levage variable
Commençons par les variables déclarées à l'aide de var :

console.log(greeting); // Output: undefined
var greeting = "Hello, World!";

Que se passe-t-il ici ? JavaScript traite le code comme ceci lors de l'exécution :

var greeting; // Declaration is hoisted
console.log(greeting); // Accesses the variable before initialization
greeting = "Hello, World!"; // Initialization happens here

Mais avec let et const, c'est une autre histoire :

console.log(name); // ReferenceError: Cannot access 'name' before initialization
let name = "Sudhil";

Les variables déclarées avec let ou const sont levées, mais elles sont dans une "zone morte temporelle" (TDZ) jusqu'à ce que leur déclaration soit rencontrée.

2. Fonction de levage
Les déclarations de fonctions sont entièrement hissées, leur nom et leur corps sont disponibles avant la ligne de déclaration :

sayHello(); // Output: "Hello!"

function sayHello() {
    console.log("Hello!");
}

Cependant, les expressions de fonction se comportent différemment :

sayHi(); // TypeError: sayHi is not a function

var sayHi = function () {
    console.log("Hi!");
};

Dans ce cas, la variable sayHi est hissée mais n'est initialisée que lorsque l'affectation est atteinte.

3. Levage de classe
Les classes se comportent de la même manière pour let et const. Ils sont hissés mais ne sont pas accessibles avant leur déclaration.

const instance = new MyClass(); // ReferenceError: Cannot access 'MyClass' before initialization

class MyClass {
    constructor() {
        this.name = "Classy!";
    }
}

Pourquoi le levage est-il important ? ?

1. Prédire le comportement
Comprendre le levage vous aide à prédire comment votre code s'exécutera et à éviter les pièges courants comme l'utilisation de variables avant leur initialisation.

2. Code propre
Pour éviter toute confusion, déclarez les variables et les fonctions en haut de leur portée. Cela correspond au comportement de levage de JavaScript et rend votre code plus lisible.

Conclusion ?

Voici ce qu'il faut retenir à propos du levage : ?

• Les déclarations (variables, fonctions et classes) sont levées ; les initialisations ne le sont pas.
• les déclarations var sont hissées avec undefined ; laissez et const rester dans la zone morte temporelle.
• Les déclarations de fonctions sont entièrement levées, mais pas les expressions de fonctions.
• Le levage aide le moteur JavaScript à comprendre votre code, mais comprendre le levage vous aide à écrire un meilleur code.

Merci d'avoir lu ! ?
Continuez à expérimenter les bizarreries de JavaScript et restez à l'écoute pour en savoir plus sur cette série.?
Bon codage ! ???‍?✨

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!