JavaScript variable scopes Deep understanding of _javascript techniques

Source: Internet
Author: User
Tags define local variable scope
Before learning the variable scope of JavaScript, we should be clear on a few points:
A, JavaScript's variable scope is based on its specific scope chain.
b, JavaScript does not have block-level scopes.
C, variables declared in a function are defined throughout the function.

1. The scope chain of JavaScript
First look at the following code:
Copy Code code as follows:

<script type= "Text/javascript" language= "JavaScript" >
var rain = 1;
function Rainman () {
var mans = 2;
function inner () {
var innervar = 4;
alert (rain);
}
Inner (); Calling the inner function
}
Rainman (); Calling the Rainman function
</script>

Observe alert (rain), the code. JavaScript first looks in the inner function to see if the variable is defined rain, if it is defined, use the rain variable in the inner function, or if the rain variable is not defined in the inner function, JavaScript continues to look in the Rainman function to see if the rain variable is defined, in which the rain variable is not defined in the Rainman function body, and the JavaScript engine continues to look up (the global object) to see if it defines rain In the global object we defined rain = 1, so the end result would pop ' 1 '.
Scope chain: When JavaScript needs to query for a variable x, it first looks for the first object in the scope chain, and if the first object does not define an X variable, JavaScript continues to find that there are no X variables defined, and if the second object is undefined, it continues to find, and so on.
The above code involves three scope chain objects, followed by: Inner, Rainman, window.

2. Within the function body, local variables have higher precedence than global variables of the same name.
Copy Code code as follows:

<script type= "Text/javascript" language= "JavaScript" >
var rain = 1; Define Global Variables Rain
function Check () {
var rain = 100; Define local variables Rain
alert (rain); 100 will pop up here.
}
Check ();
alert (rain); 1 will pop up here.
</script>

3, JavaScript is not a block-level scope.
This is also a more flexible part of JavaScript than other languages.
With a careful look at the following code, you will find that the variables I, j, K scopes are the same, and they are global throughout the rain function.
Copy Code code as follows:

<script type= "Text/javascript" language= "JavaScript" >
function Rainman () {
/**
* There are three local variables I J k in the Rainman function body
*/
var i = 0;
if (1) {
var j = 0;
for (var k = 0; k < 3; k++) {
Alert (k); Eject 0 1 2 respectively
}
Alert (k); Pop up 3
}
Alert (j); Pop up 0
}
</script>

4, the variables declared in the function are defined throughout the function.
First, look at this piece of code.
Copy Code code as follows:

<script type= "Text/javascript" language= "JavaScript" >
function Rain () {
var x = 1;
Function Man () {
x = 100;
}
Mans (); Call Man
alert (x); 100 will pop up here.
}
Rain (); Call Rain
</script>

The code above shows that variable x can be used throughout the rain function and can be assigned a new value. Because of this rule, there will be "unthinkable" results, observe the following code.
This is because the local variable x in the function rain is defined throughout the function (Var x= ' Rain-man ', declared), so a global variable x with the same name is hidden throughout the rain function body. The reason for this is that the ' undefined ' is ejected because the local variable x is still not initialized when the first execution of alert (x) is performed.
Copy Code code as follows:

<script type= "Text/javascript" language= "JavaScript" >
var x = 1;
function Rain () {
alert (x); Pop ' undefined ' instead of 1
var x = ' Rain-man ';
alert (x); Pop ' Rain-man '
}
Rain ()
</script>

So the rain function above is equivalent to the following function.
Copy Code code as follows:

function Rain () {
var x;
alert (x);
x = ' Rain-man ';
alert (x);
}

5. Variables not defined using the VAR keyword are global variables.
Copy Code code as follows:

<script type= "Text/javascript" language= "JavaScript" >
function Rain () {
x = 100; The global variable x is declared and assigned
}
Rain ();
alert (x); Will pop up 100
</script>

This is also the common error of JavaScript novice, inadvertently left many global variables.
6, global variables are the properties of the Window object
Copy Code code as follows:

<script type= "Text/javascript" language= "JavaScript" >
var x = 100;
alert (window.x);//Eject 100
alert (x);
</script>

Equivalent to the following code
Copy Code code as follows:

<script type= "Text/javascript" language= "JavaScript" >
window.x = 100;
alert (window.x);
Alert (x)
</script>

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.