JavaScript variable names and function names the same name issue

Reprinted God duplicate names on a large variable names and function names:

a. 1 = var;
function B () {
a = 10;
return;
function a () {
the console.log (a);
}
}
B ();
the console.log (a);
much of this problem is to print out a it? There may be a lot of students that print out is 10, but in fact not, why?

Myth # 1: variable lift

I think we all understand that, in the implementation of the function b, because of its interior has an a = 10, front and did not var, so after the completion of execution of the function b, the variable a to a global variable, and the value of 10 covered previously thought 1. 10 is so printed. I think if this is the idea most novice.

Here's knowledge:

Display statement: var a = 1;

Implicit declaration: a = 1;

Implicit variable declaration will be promoted to global variables

Myth # 2: I do not know the function declaration is also a promotion

Most novices think at the time of execution of the function b, js execution of code from top to bottom, to return execution when the function exits, no longer performs a function, it is considered that a function does not work.

js knowledge blind spot: the pre-analytical and analytical sequence js variable declaration

js pre-parsed: Before executing code, js will pre-parsing code, code if there are variable declarations and function declarations, then put variable declarations and function declarations top, the Internet most people think the function declaration top than the variable declaration top higher priority. (In fact the case? Here to bury a pit, before we discuss later)

js parsing order declaring variables: js when parsing variable declaration is divided into two steps.

This code example: var a = 1; in fact, is divided into (1) var a; (2) a = 1; for the two analytical steps.

Well, finished two points knowledge, then I rewrite the original code that follows:

B function () {
function A () {// function declaration top
the console.log (A);
}
A = 10;
return;
}
var A;
A =. 1;
B ();
the console.log (A);
then we Let's look at this code, you feel the eyes of the answer is how much? If words still feel equal to 10, then it means you have not taken into account the focus of this talk about: duplicate names!

Before explaining this code, I would like to give you a universal knowledge: the scope chain (if students do not understand, you can access the link: js closures).

Well, to understand the students should understand the scope chain, in a call to a variable or object property such as when the sequential search is from the inside outward, js code is executed from top to bottom.

So let us analyze the code just after the modification:

1) to declare a variable, the variable a system to allocate a memory, attention, here a variable not yet know its variable type, because there was no assignment;

2) a = 1, 1 is assigned to a variable, a variable of type Number;

3) started the function b, there is a function called a function declaration, and the function of a variable below a variable named a, and 10 in the function assigned to b, here began Difficulties. First look at a function, due at the time of execution of the function b, and did not call a function, a function and therefore did not work; but to execute when a = 10, js do so: 1. First find the address of a variable , according to the scope chain find from system memory; 2 since the scope chain search order is from the inside out, so the first start looking inside the function b;.. 3 in the search process, it was found in the function b have declared a function called a function (duplicate names!), so after finding the function of a function named, there was never find out; 4. so here is a = 10 to 10 is actually assigned to the this function is called a function object!

Some students will ask why. Put it this way, when the function b inside of a function to enhance the top, with similar variables (both declared in the js), Js to a function allocates memory, but that happens in execution when a = 10, priority Find a function with the same name as a variable a, because of its scope in recent! In talking about this, I think most of the students have understood the question why this print 1, right?

Because since a = 10 the value 10 is assigned to a function object, then global environment running in the console.log (a), a global variable is accessed, and the global variable in a system memory to find a value of 1, so 1 is printed.

So students can themselves be a function of a function of b to comment out, and see what the results are printed? Look at the code:

B function () {
A = 10;
return;
}
var A;
A =. 1;
B ();
the console.log (A);
obvious answer is 10, why? Most students are aware of it, yes, there is scope in the function b where there are no objects or to find a variable named, then continue to look outwards, have found discovered a memory variable in the global scope address, then the value of 10 is assigned to the global variable a.

understood? Well, we then modify the code once again, as follows:

B function () {
A = 10;
return;
}
B ();
the console.log (A);
this is very simple, right? How much value to print it? Still 10, right, and why? Is such that, at the time of execution of the function of b, there is an implicit statement found in a = 10, find its scope in the function b in the address is less than about a name, then look out, to find the global scope under no, then the variable lift system defaults to a variable a memory, and the value assigned to a variable, so variable a variable to a global variables. 10 is so printed.

Well, finished this, we continue to see if I have just planted the pit, now we run these two codes:

Code 1:

var a;
function a(){  
  console.log(10);  
}  
console.log(a);
代码2:

A function () {  
  the console.log (10);  
}  
var A;
the console.log (A);
then run we find, the results of two runs is the same as the code, are: function a () {console.log (10)}.

This should permit the online statement: function declaration Sticky Sticky higher priority than the variable declarations. If not, then the second paragraph of the code should be printed undefined, but why print out is a function of it? This example tells us whether variable declarations Sticky Sticky higher priority than the function declaration?

But it is clear to inform you that the function declaration top more than the variable declaration top priority. But the results are not in accordance with the above statement to enhance the thinking point of view, because in the pre-analytical phase variable is only declared, but not the assignment, and the function is not the same, it is in the pre-analytical phase has been declared and assignment, and its value is a function of this object, and at the time of printing, the printing is need of a specific value, and the variable has not been assigned a function already assigned, so are the results of two runs function a () {console.log (10)}. If the function to remove a, operating results are undefined, because a is initialized and assigned to the undefined.

Variable names and function names the same name Summary:

1. To know the order js resolve the variable declaration

2. function declarations and variable declarations and function declarations will remain the top priority and more!

3. Find the order of the scope chain is from the inside out, js code execution order is from top to bottom
----------------
Disclaimer: This article is CSDN bloggers' Charles_Tian " the original article, follow the CC 4.0 BY-SA copyright agreement, reproduced, please attach the original source link and this statement.
Original link: https: //blog.csdn.net/charles_tian/article/details/79775909

Guess you like

Origin www.cnblogs.com/weizhichang/p/11955090.html