JavaScript Tour-First stop: Starting with variables

Source: First-line Code Farm Blog Welcome to share the original to Bole headlines

Work these years, JS study is not very good, just weekend some leisure time, simply buy this "JS authoritative guide", the famous rhino book, Good to JS in-depth look. The first impression of buying the book is that the thief is thick, but half the back is a reference manual.

One: Scope

The first thing to say about variables is the scope, it is because unfamiliar with the scope of JS, often will be the object-oriented scope pigtailed, after all, some things are always habitual such, but not every copy is possible, then the next problem is, JS exactly what scope, Of course the function scope, our browser is an instance

Window object, if you define a Name field under Window, the Name field has the function scope of window, which is accessible under window, if you define a function ctrip under window, Then define a name inside, then this new definition name can only be used under the Ctrip function, and the old name continues under the window general, for example.

You can see two points:

1: Define a name under window, incredibly can also define a name under function, which is unthinkable in C #.

2: In JS can be done blind, it only recognize their own scope, so there is the first "second", you may think this is no strange place, this is because you may not really understand what is 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 to look for, then the Var name= "Second" this statement is defined in the Ctrip any position is possible, the following we have to replace the statement.

Can see under the Ctrip function, the first console.log output is undefined, the result can be confirmed, did the first thing is to collect the name of the local variable, perhaps some people say why did not become "second", That is because the initialization operation must be executed on a per-statement basis, so when executing console.log (name) 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 function only have scope within the function scope, and we also see that the above example is just a layer of nesting, window is a large function, Inside is a Ctrip function, the same principle can extend to multiple layers of nesting, such as three layers, four layers .... N-layers, these layers form a chain structure.

Can see, I ctrip under the definition of a plane function, so that there will be three layers, the output is what we want to see, each layer of name only in its own scope to take effect, but there is a problem, one day I was stupid, in the definition of plane function, the Var Name= "Third" in the Var forget to write, then this time, plane name in the end is what value? Is it first or second?

123456789101112

var name="first";function ctrip(){  var name="second";  function plane(){     name="third";     console.log(name);  }  plane();  console.log(name);}ctrip();console.log(name);

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

Another day, I drank a lot of wine and silly forced a back, in the definition of plane function, the name= "third" wrong written nam= "third"; Lost an E, you can say is the problem of alcohol, is not my code problem. So what is the parser going to do with this time? The same truth, in the backtracking, found that Ctrip did not, and then back to the top of the window, found or not, this time the parser did such a deal, since the whole chain is not, you have to assign value, I can not give you an error, that much awkward ah, Just give you an implicit definition of the NAM Variable under window, and Nam is actually a global variable. We can have a look at the top of window console for Nam.

Well, there are so many things about variables, no surprise, no sense of understanding.

JavaScript Tour-First stop: Starting with variables