Home > Web Front-end > JS Tutorial > Common interview questions: JavaScript variable promotion

Common interview questions: JavaScript variable promotion

青灯夜游
Release: 2019-11-28 17:14:02
forward
2296 people have browsed it

What is JavaScript variable hoisting? This is often asked in interviews. The following article will introduce to you JavaScript variable improvement. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to everyone.

Common interview questions: JavaScript variable promotion

JavaScript variable hoisting

HoistingJavaScript will move the statement Default behavior to top. [Related course recommendations: JavaScript Video Tutorial]

JavaScript declaration enhancement. In JavaScript, variables can be declared after use. In other words; variables can be used before they are declared. Example 1 gives the same result as Example 2:

Example 1:

<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>js</title>
<body>
<p id="demo"></p>
<script>
    x = 5; // 给x赋值5
    elem = document.getElementById("demo"); // 查找一个元素
    elem.innerHTML = x;           // 在元素内显示x
    var x; // 声明 x
</script>
</body>
</html>
Copy after login

Example 2:

!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>js</title>
<body>
<p id="demo"></p>
<script>
    var x; // 声明 x
    x = 5; // 把5赋值给x
    elem = document.getElementById("demo");
    elem.innerHTML = x;
</script>
</body>
</html>
Copy after login

To understand this, you must understand "declaration promotion" :Hoisting)". Refers to JavaScript's default behavior of moving all declarations to the top of the current scope (to the top of the current script or current function).

But this default behavior has been changed in ES6. Variables declared by let and constants declared by const in ES6 will not be promoted!

JavaScript initialization will not be promoted

JavaScript only hoists declarations, not initializations. Example 1 and Example 2 are different results:

Example 1:

<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>js</title>
<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>
Copy after login

Example 2:

<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>js</title>
<body>
<p id="demo"></p>
<script>
    var x = 5; // 初始化 x
    elem = document.getElementById("demo"); // 查找一个元素
    elem.innerHTML = x + " " + y;       // 显示x和y
    var y = 7; // 初始化 y
</script>
</body>
</html>
Copy after login

Declare your variables at the top!

To many developers, variable hoisting is an unknown or overlooked JavaScript behavior. If the developer does not understand promotion, the program may contain errors (Error). To avoid errors, always declare all variables at the beginning of each scope. Since this is how JavaScript interprets code, it's always a good rule to follow.

This article comes from the js tutorial column, welcome to learn!

The above is the detailed content of Common interview questions: JavaScript variable promotion. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:51cto.com
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template