Levage de variables JavaScript

Quel est le résultat du programme suivant ?

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<script type="text/javascript">
var foo = 1;
function bar() {
if (!foo) {
var foo = 10;
}
alert(foo);
}
bar();
</script>
</head>
<body>
</body>
</html>

Le résultat apparaît : 10

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<script type="text/javascript">
var a = 1;
function b() {
a = 10;
return;
function a() {}
}
b();
alert(a);
</script>
</head>
<body>
</body>
</html>

Le résultat apparaît : 1

Vous choquer, droite? Ce qui s'est passé? Cela peut paraître inconnu, dangereux et déroutant, mais il s'agit également d'une fonctionnalité très utile et impressionnante du langage JavaScript : le levage de variables.

L'initialisation JavaScript ne déclenchera pas

JavaScript seules les variables déclarées seront Promotion , l'initialisation ne le sera pas.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<p id="demo"></p>
<script>
var x = 5; // 初始化 x
var y = 7; // 初始化 y
elem = document.getElementById("demo"); // 查找元素 
elem.innerHTML = x + " " + y;           // 显示 x 和 y
</script>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<p id="demo"></p>
<script>
var x = 5; // 初始化 x
elem = document.getElementById("demo"); // 查找元素 
elem.innerHTML = "x 为：" + x + "，y 为：" + y;           // 显示 x 和 y
var y = 7; // 初始化 y
</script>
</body>
</html>

2 La sortie y n'est pas définie, c'est parce que le La déclaration de variable (var y) est levée, mais l'initialisation (y = 7) n'est pas levée, donc la variable y est une variable non définie.

Déclarer vos variables dans l'en-tête

fonctionne pour la plupart des programmeurs Je ne savais pas à propos du levage de variables JavaScript.

Si les programmeurs ne comprennent pas bien la promotion des variables, les programmes qu'ils écrivent sont sujets à des problèmes.

Afin d'éviter ces problèmes, nous déclarons généralement ces variables avant le début de chaque portée. Il s'agit également d'une étape d'analyse JavaScript normale et facile à comprendre.

Formation continue

nouveau fichier

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <p id="demo"></p> <script> var x = 5.5; // 初始化 x elem = document.getElementById("demo"); // 查找元素 elem.innerHTML = "x 为：" + x + "，y 为：" + y; // 显示 x 和 y var y = 7; // 初始化 y </script> </body> </html>

soumettre Réinitialiser le code

Opération automatique

Levage de variables JavaScript

ÉlémentaireTutoriel de site Web d'imitation d'entreprise Imperial CMS

ÉlémentaireLes débutants sans aucune base dans WordPress créent des blogs personnels et des sites Web d'entreprise

ÉlémentaireVidéo d'instructions sur la création de sites Web à base zéro Ultimate CMS

ÉlémentaireProjet front-end-Shangyou [Pratique complète de la technologie HTML/CSS/JS]

IntermédiaireVue3.0 de 0 pour créer une pratique de projet de système de gestion backend universel

ÉlémentaireCours frontal base zéro [Vue apprentissage avancé et application pratique]

ÉlémentaireTutoriel WEB front-end [HTML5+CSS3+JS]

ÉlémentaireIntroduction rapide à apipost

IntermédiaireTutoriel pratique Vue3+TypeScript au niveau de l'entreprise

ÉlémentaireParlons brièvement de la création d'une entreprise en PHP

IntermédiaireProjet de commerce électronique VUE (combat réel de projet double front-end et back-end)

ÉlémentaireApplication pratique Apipost [api, interface, tests automatisés, mock]