Démêler JavaScript : une plongée approfondie dans le levage, la zone morte temporelle et les états variables

Ci-dessous, j'ai 2 lignes de code douces et simples. Mais je peux vous garantir que cela vous rendra très confus (par exemple parce que vous avez ignoré le principe souligné de JS) ou vous réconfortera.

Mais il contient des concepts de connaissances entièrement chargés comme ci-dessous

• Levage
• Zone morte temporelle
• variable (non déclarée, non initialisée, non définie) (Bonus)

Ma déclaration contradictoire
comme comme var, const et let hissent également leurs propriétés, mais ils sont dans une zone différente.

levage Def (version simple/profane)

1. nous pouvons accéder aux fonctions et aux variables avant sa déclaration réelle.

Il est maintenant temps d'approfondir la façon dont Js compile et exécute notre code à 2 lignes

En JavaScript, la façon dont le compilateur et le moteur gèrent les déclarations et les affectations de variables peut être nuancée, en particulier lorsqu'il s'agit de let et var.
Décomposons le processus du point de vue du compilateur et de l'exécution pour le code donné :

name = 'ashu';
let name;

à ce stade, je précise que lorsque nous écrivons le code javascript, le premier analyseur et compilateur compile notre code, puis il passe en phase d'exécution.

Perspective du compilateur
Première ligne : nom = 'ashu';

Pendant la phase de compilation,
le moteur JavaScript analyse le code et crée les étendues nécessaires.
Le nom de l'affectation = 'ashu' ;

sera noté, mais à ce stade, le moteur n'exécute pas le code ; il enregistre simplement l'existence d'une affectation à une variable nommée nom.

Si le nom n'a pas été déclaré auparavant, le compilateur le traite comme une affectation à une variable globale (nom de la var dans la portée globale) puisque les déclarations var sont hissées et accessibles globalement.

Deuxième ligne : let name;

Lorsque le compilateur rencontre le nom let ; déclaration, il reconnaît que nom doit avoir une portée de bloc.

Le compilateur place le nom dans la zone morte temporelle (TDZ) pour la portée à laquelle il appartient,
ce qui signifie qu'il reconnaît l'existence du nom mais le marque comme non initialisé.

La déclaration let n'est pas hissée de la même manière que var.

Au lieu de cela, il crée une liaison dans la portée et ne l'initialise que lorsque la déclaration est exécutée.

Perspective d'exécution

Première ligne : nom = 'ashu';

Lorsque le moteur JavaScript exécute l'affectation name = 'ashu';,
il vérifie l'existence du nom dans la portée actuelle. Puisque name est déclaré avec let mais se trouve dans la TDZ (Temporal Dead Zone), toute tentative d'y accéder avant que la déclaration let ne soit initialisée entraînera une ReferenceError.

Par conséquent, à ce stade, le nom est dans la TDZ et le nom de l'affectation = 'ashu' ; entraîne une ReferenceError.

Deuxième ligne : let name;

Cette ligne initialise la variable de nom dans la portée du bloc.
Après ce point, le nom n'est plus dans la TDZ et peut être consulté ou attribué sans erreur.

Maintenant Astuce bonus

différence entre non déclaré, non défini et non initialisé ;

undeclare :- la variable n'est pas encore déclarée.
undefined :- Variable déclarée mais non initialisée ;
non initialisé :- variable définie mais sa valeur viendra plus tard.

Ex :- résultat const = multiplierBy2(5);
jusqu'à ce que la valeur de retour de la fonction soit attribuée au résultat jusqu'à ce que ce soit dans une zone non initialisée.

Fait intéressant :-

Vous connaissez la zone morte temporelle initialement décorée pour Const mais plus tard, ils ont adopté dans **Let**

Référence :-

1. https://frontendmasters.com/courses/deep-javascript-v3 + Mon analogie avec le copilote de GitHub

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!