Shulou(Shulou.com)06/01 Report--

This article mainly explains the "JavaScript variable scope case analysis", the article explains the content is simple and clear, easy to learn and understand, the following please follow the editor's ideas slowly in depth, together to study and learn "JavaScript variable scope case analysis" bar!

1. Analysis of the scope of variables

First of all, let's study the variable scope of JavaScript, study the scope, we do not explain the concept as usual, but first give a small demo to whet everyone's appetite:

Var a = 1; var b = 2; function pomp () {alert (a); alert (b); b = 2; alert (b); var a = 3; alert (a);} pomp ()

If your answer is right, then your understanding of the scope of JavaScript is on the middle side, there may be some complex scope you do not grasp, but simple development has no problem; if you do not know the answer, then I will use this example as an example to introduce the variable scope of JavaScript.

First of all, if you have a programming foundation, you must know that for any programming language, there are concepts of local variables and global variables: the scope of global variables is global; and local variables are often defined and used in a part. outside this part, its space will be reclaimed, and we can no longer use it. Common local variables appear in for loops, function bodies, and code blocks.

What does it mean that in these "local" variables, local variables take precedence over global variables? Let's explain it with a little demo:

Var a = 1function pomp () {var a = 2 alert (a)} pomp () alert (a)

That is to say, we have a variable an in both the local and the global, so in the local, the script interpreter will first start to find the nearest position, of course, the local > greater than the global effect, so the first pop-up window is 2, and the second is 1.

After introducing local and global variables, let's go back to the original question of demo:

Var a = 1; var b = 2; function pomp () {alert (a); alert (b); b = 2; alert (b); var a = 3; alert (a);} pomp ()

Obviously, the question here is that we have declared an as a global variable and assigned a value at the same time, so why print an as undefined? This is another feature of JavaScript, which is that the interpreter delineates the scope of variables before interpreting the code one by one:

At the beginning, both an and b are declared and defined as global variables, a has a value of 1 and b has a value of 2; at this time, we define a function pomp (), inside the function, we create a local variable a, at this time, according to the analysis just now, the closest is actually the local variable a, which explains why the first alert (a) is not pop-up 1, but still does not explain undefined.

The reason for undefined is this: before the interpreter interprets the code, according to the names of other programming languages, we call this period the precompilation period. During the precompilation period, because the variable an in the function body is also declared and defined, the an in the function body is naturally assigned to the local variable a, that is, we can think that a sentence has been executed: var a, but since this is the precompilation period, var a = 3 has not been executed. So at this point we can understand that only var an is executed, and a = 3 is executed later, so this is the reason for undefined.

Finally, make a picture of the first demo to help you understand the scope of JavaScript variables:

And a summary is attached:

When using the var keyword, it can be used anywhere in the local or global, when a variable is declared, no matter where it was before, except that the undefined is displayed.

2.var keyword

In the original JavaScript, there is only the keyword var, so the above scope explanation is for the var keyword, so for the var keyword, I will not repeat it here, but give it to a small demo to understand:

Alert (a) var a = 3alert (a)

But to avoid some friends starting from here, I would like to repeat:

A variable declared by the var keyword, as long as it is declared anywhere locally / globally, exists elsewhere, even if it is not declared, because the variable has been declared during the precompilation phase, but it displays undefined, that is, undefined, and then when executed to var a = 3, it is defined with a value of 3.

By the way, let's briefly talk about the difference between the declaration and definition of variables:

Var a; this sentence is called declaring variable a

A = 3; this sentence is called defining variable a

Var a = 3; this sentence is called declaring variable an and defining an as 3

3.let and const keywords

First, let's start with a demo:

Alert (a) let a = 3alert (a)

Hey, after everyone clicks, is there nothing? it's not that I'm playing a prank, but it's really nothing, because it's wrong ():

Boy, the same way of writing, why var does not report wrong, let reported wrong? (note that the use of const is the same here, and the scope of const and let is the same, that is, errors will be reported with const!)

The reason is that we have been suffering from var for a long time, and this let keyword is a way of declaring variables that is more consistent with our logic of thinking, in the scope of let:

A variable can only be used after it is declared, not like var, as long as there is a declaration anywhere, then it can be used in front of it!

Finally, we briefly introduce the concept of uniqueness of const,const on the basis of let:

Once a const variable is defined, its value can no longer be modified. It is suitable for defining specific constants, such as:

Const pi = 3.14

Const e = 2.7

The scope of const is the same as let!

Comparison of 4.var, let and const

After reading three keywords in one breath, let's sort it out briefly. Before combing, let's start with a demo:

Function demo () {for (var I = 1; I < 10; iTunes +) {/ /} alert (I) for (let j = 1; j < 9; Jake +) {/ /} alert (j)} demo ()

As you can see, there seems to be a little doubt here, because we know that the for loop is a local, so the local variables I and j should not exist outside the for loop, but obviously, if we check it, we will find that the pop-up window pops up with a 10, that is to say, the current value of I is still 10, and j does not exist, as we thought, and it is wrong:

Then why did this happen? The reason is that the local variable declared by the var keyword will only reclaim memory when the whole large part exits, that is to say, although the for loop is also a local, but this part belongs to the large part of function, so there is still I, but let has obviously met our expectations again!

Characteristics of keyword scope values var variables are declared anywhere in the local / global and can be used directly (even before the declaration) in the corresponding local / global, but undefined occurs if not defined. The let variable can be modified repeatedly and can only be used after the declared statement. The const variable can be modified repeatedly and can only be used after the declared statement. Can not be modified thank you for your reading, the above is the "JavaScript variable scope instance analysis" content, after the study of this article, I believe you have a deeper understanding of the JavaScript variable scope instance analysis of this problem, the specific use also needs to be verified by practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.