Scope and scope chain of JavaScript variables _javascript tips

Source: Internet
Author: User

Work these years, JS learning is not very good, just a weekend some leisure time, simply buy this "JS authoritative guide", the famous rhino book, take a good look at JS deep. The first impression of buying the book is that the thief is thick, but half of the rest is a reference manual.

One: Scope

The first thing to say about variables is the scope, it is because not familiar with the scope of JS, often will be the scope of the object-oriented confusedly, after all, some things are always habitual this way, but not every copy is possible, then the next question will come, JS in the end what is the scope, Of course it is the function scope, our browser is an instantiated window object, if you define a Name field under window, then the Name field has the function scope of window, which is accessible under window. If you define a function Ctrip under window and then define a name inside, the name of the new definition can only be generalized under the Ctrip function, and the old name continues to be generic under Windows, for example.

You can see from the figure two points:

1: In the window under the definition of a name, you can also define a function under the name of a duplicate, which is unthinkable in C #.

2: In JS can do blind, it only has its own scope, so there is the first "second", you may find this is nothing strange, this is because you may not really understand what is the function scope, the parser in the execution of Ctrip, The first thing is to look for all the local variables under the Ctrip, and then execute the subsequent statements, since it is the first search, then the Var name= "Second" this statement is defined in any location in the Ctrip is possible, the following we replace the statement.

You can see that in the Ctrip function, the first console.log output is undefined, and this result confirms that the first thing you did was collect the name of this local variable, and some might say why it didn't turn into "second", That's because the initialization operation must be executed on a per-statement basis, so when Console.log (name) is executed in the Ctrip function, the parser only knows that there is an unassigned variable name, so the console is undefined.

Two: Scope chain

As we know from the above example, the variables defined in the function only have function scoped scopes, and we see that the example above is just a layer of nesting, and window is a large function. Inside is a Ctrip function, the same truth can be extended to multiple nesting, such as three, four layers .... N-layer, these layers form a chain structure.

As you can see from the diagram, I have defined a plane function under Ctrip, so that there are three layers, and the output is what we want to see, and the name of each layer is only within its scope.

In effect, but there is a problem here, one day I was stupid, in the definition of plane function, the Var name= "third" in the Var forgotten to write, then this time, plane in the

What is the value of name in the end? Is it the one or the second?

Copy Code code as follows:

var name= "a";
function Ctrip () {
var name= "Second";
Function plane () {
Name= "Third";
Console.log (name);
}
Plane ();
Console.log (name);
}
Ctrip ();
Console.log (name);

Now is the test of whether you really understand the scope chain, think about it, when the code executes to the plane function of the name= "third", found in the plane function does not have the name of this local variable, just the code in the Ctrip this large function, So the parser goes back to the Ctrip function to look for name, and finds that there is name, and this time the name of Ctrip is changed to "third".

Another day, I drank a lot of wine and stupid forced a back, in the definition of plane function, the name= "third" wrong written nam= "third"; Lost an E, you can say is the question of alcohol,

It's not a problem with my code. So what do you do with the parser at this time? In the same way, when backtracking, found that Ctrip did not, and then back to the top of the window, found that there is no,

This time the parser did such a deal, since the whole chain is not, you also assign a value, I can not give you an error, that many embarrassing ah, simply give you in the window under the implicit definition of a

Nam variable, this time Nam is actually a global variable. We can console Nam at the top of the window.

Well, there's just so much about the variables, and there's nothing strange about it, and it doesn't mean anything to understand.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.