The concept of scope in JS:
Indicates the area where variables or functions work, and refers to the context in which they are executed, that is, the context execution environment. There are only two scopes in Javascript: global scope and local scope. Local scope is distinguished by functions.
Let’s look at a few questions first:
1.
if(true){
var aa= "bb";
}
console.log(aa); //bb
for(var i = 0; i < 100; i ){
//do
}
console.log(i); //100
2.
var bb = '11111';
function aa() {
alert(bb);//undefine
var bb = 'test';
alert(bb);//test
var cc = "test1";
alert(age);/ /Syntax error
}
aa();
3.
var test = '1111111';
function aa() {
alert(test);
}
function bb() {
var test = '22222222';
aa();
}
bb();//alert(1111111);
4.
alert(typeof aa); //function
alert(typeof bb); //undefined function aa() { //Function definition
alert('I am 111111111');
};
var bb = function() { //Function expression Formula
}
alert(typeof bb);//function
5.
function aa(){
var bb = "test";
cc = "test";
alert(bb);
}
aa();
alert(cc);//Test
alert(bb);//Syntax error
The above 5 questions all summarize js The problem of medium scope
can be summarized in the following points
1. No block-level scope
As can be seen from the first question, in {} After execution, the variable is not destroyed, but is still stored in memory, so we can access it.
2. Functions in JavaScript run in the scope in which they are defined, not in the scope in which they are executed.
The concept of function scope chain is mentioned here, in In ECMA262, this is the case
The scope at any execution context time is implemented by the scope chain.
When a function is defined, the scope when it is defined will be The scope chain is linked to the [[scope]] attribute of this function object.
When a function object is called, an active object (that is, an object) is created, and then the formal parameters of each function are named As the named attribute of the active object, then use this active object as the front end of the scope chain at this time, and add [[scope]] of this function object to the scope chain.
So the question 3 The result is alert(1111111);
3. JS will process the function definition and var keyword in advance
As in question 4, start alert(bb); //undefine, alert(age) //Syntax error, what is the difference between the two? The reason is that there is var bb = "test" at the end. The var keyword is processed in advance during initialization, but it is not assigned at the beginning
Modify the code Like this, you can see that
var dd = '11111 ';
function aa() {
alert(bb);//undefine
var bb = 'test';
alert(bb);//test
var cc = "test1 ";
alert(age);//Syntax error
}
aa();
alert(dd);//11111
alert(cc);//Syntax error
Here alert(bb) does not report a syntax error, but alert(age) reports a syntax error.
But please note:
< script>
alert(typeof aa); //Result: undefined
<script> <br>function aa() { <br>alert('yupeng'); <br>} <br></script>
This shows that js precompilation is based on segments. Same for question 4
4. Function-level scope
The variables defined in the function are destroyed after the function is executed and no longer occupy the memory area.
So question 2 ends with alert(cc); syntax error is reported, question 5 ends with alert(bb) in the same way