Parlons de la promotion des déclarations en JavaScript

Cet article vous apporte des connaissances pertinentes sur JavaScript, qui présente principalement le contenu pertinent sur la promotion des instructions. La promotion des instructions est une fonctionnalité de l'analyseur JavaScript, qui extrait les effets des instructions de déclaration de fonction et de variable dans le code. de la portée où il se trouve. Jetons-y un coup d'œil, j'espère que cela sera utile à tout le monde.

[Recommandations associées : Tutoriel vidéo JavaScript, front-end Web]

Le levage de déclaration (hébergement) est une fonctionnalité de l'analyseur JavaScript, qui y extrait les fonctions et les instructions de déclaration de variable dans le code. L'avant de la lunette.

Promotion des fonctions

JavaScript prend en charge l'appel de fonctions avant la déclaration de fonction.

say();function say() {  console.log("Hello");
}

L'analyseur analysera le code dans la portée et extraira la déclaration de fonction au début du code exécuté. Voici donc comment l'analyseur regarde ce code :

function say() {  console.log("Hello");
}say();

En plus des fonctions ordinaires, il existe également des fonctions asynchrones, des fonctions *, des fonctions asynchrones * Même effet liftant. async function, function *, async function * 也有相同的提升效果。

var 变量声明提升

var 关键字的变量声明会被提升，但变量的赋值不会被提升。

console.log(foo); // undefinedvar foo = "bar";console.log(foo); // 'bar'

以上代码的解析结果为：

var foo;console.log(foo);
foo = "bar";console.log(foo);

这可能会导致一些奇怪的问题：

var x = "x in global";

(function () {  // 这里期望读取全局变量
  console.log(x); // 结果为undefined. 
  /* ... */
  // 在函数内某处
  var x = "x in function";
})();

在过去，为了规避这种奇怪的提升，大家普遍把var 声明写在作用域的最前面。

var x='x';var y='y';function (){    var x;    var foo;    // ...}

当然，现在我们选择不用 var，改用更合理的 let 和 const。

let 和 const 变量声明和死区

那么，let 和 const 就不存在变量提升了吗？—— 未必。

看这个例子：

const x = "x in global";

(function () {  // 这里期望读取全局变量
  console.log(x); // ReferenceError: Cannot access 'x' before initialization
  /* ... */
  // 在函数内某处
  const x = "x in function";
})();

执行报错，说明 const x = "x in function"; 一行影响了作用域内的上方区域代码。

解析器会扫描当前作用域下的 const 和 let 声明，在声明语句之前使用变量名都会触发 ReferenceError。这样可以避免上面提过的 var 提升问题和模糊不清的代码范式。

class 关键字也有同样的效果，new 一个未声明的类也会发生 ReferenceError。

new MyClass(); // ReferenceError: Cannot access 'MyClass' before initializationclass MyClass {}

有人认为这种情况不属于提升，毕竟声明和赋值都没有提前；也有人认为这些语句在执行之前就产生了影响，其作用提升了。个人偏向后者，这是对（变量和类名）标识符的提升。

总结

一些 JavaScript 声明语句的效果会影响到所在的整个作用域，这种现象称为提升。

有 3 种类型的提升：

• function 关键字的声明和赋值都提升。
• var 关键字声明提升，赋值不提升。
• let, const, class

  var Promotion de la déclaration de variable

var La déclaration de variable du mot-clé sera promue, mais l'affectation de la variable ne sera pas promu.

rrreeeLe résultat de l'analyse du code ci-dessus est : rrreeeCela peut conduire à des problèmes étranges : rrreee

Dans le passé, afin d'éviter cette étrange amélioration, tout le monde écrivait généralement le var déclaration au devant de la portée. 🎜rrreee🎜Bien sûr, nous choisissons maintenant de ne pas utiliser var, mais d'utiliser à la place les plus raisonnables let et const. 🎜

let et const déclaration de variable et zone morte 🎜🎜Donc, let et const La promotion variable n'existe-t-elle pas ? —— Pas nécessairement. 🎜🎜Regardez cet exemple : 🎜rrreee🎜L'erreur d'exécution est signalée, indiquant que la ligne const x = "x in function"; affecte l'indicatif régional supérieur dans la portée. 🎜🎜L'analyseur analysera les déclarations const et let dans la portée actuelle. L'utilisation de noms de variables avant l'instruction de déclaration déclenchera ReferenceError. Cela évite le problème de promotion var et les modèles de code ambigus mentionnés ci-dessus. 🎜🎜Le mot-clé class a également le même effet, new une classe non déclarée provoquera également ReferenceError. 🎜rrreee🎜Certaines personnes pensent que cette situation n'est pas une amélioration, après tout, la déclaration et l'affectation ne sont pas faites à l'avance ; d'autres pensent que ces déclarations ont un impact avant d'être exécutées, et que leur effet est amélioré. Personnellement, je préfère cette dernière, qui est la promotion des identifiants (noms de variables et de classes). 🎜

Résumé🎜🎜Les effets de certaines déclarations JavaScript affecteront toute la portée où elles se trouvent. Ce phénomène est appelé promotion. 🎜🎜Il existe 3 types de promotion : 🎜La déclaration et l'affectation des mots clés

• function sont toutes deux promues. 🎜La déclaration du mot clé
• var est promue, mais l'affectation n'est pas promue. 🎜 Les identifiants
• let, const, class sont promus, formant une zone morte, et ni la déclaration ni l'affectation ne sont promues. 🎜🎜🎜【Recommandations associées : 🎜Tutoriel vidéo JavaScript🎜, 🎜front-end web🎜】🎜

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!