variable scope
function fun() {
var a = 123;
}
fun();
console.log(a);
//ReferenceError: a is not defined
//函数外无法调用函数内变量
There are two scopes in JS:
1. Global scope
- written directly in the script tag of JS
- the global scope is created when the page is opened and destroyed when the page is closed
- there is a global object window, which represents a browser window, Created by the browser, we can use it directly
- Variables created in the global scope are saved as properties of the window object
- Functions created in the global scope are saved as methods of the window object
- Variables in the global scope are global variables , Any part of the page can be called
//变量都作为window对象的属性
<script>
var a = 10;
console.log(window.a); //浏览器窗口的控制台输出 10
</script>
//函数都作为window对象的方法
<script>
function fun(){
console.log("nihao");
}
window.fun();
</script>
2. Function scope
- Create a function scope when calling a function, and destroy it after the function is executed
- Every time a function is called , a new function scope will be created, and they are independent of each
other - The function scope can access the global scope Variables, variables in the function scope cannot be accessed globally
- when operating variables in the function scope, first look for them in their own scope, if not, then look for them in the upper level scope until the global scope, and the global scope also No, report an error.
- If you want to access variables in the global scope in a function (it also has variables with the same name), you can use window, variable name call
(1)
var a = 20;
function as(){
console.log(a)
}
as(); // a = 20
（2）
var a = 20;
function as(){
var a = 10
console.log(a) // a = 10
}
(3) There is also the feature of early declaration in the function scope. Variables that use the var keyword are declared before all codes of the function are executed.
function as(){
console.log(a) // a 提前被声明，单位被赋值 ，undefined
var a = 10
}
the difference:
function as(){
console.log(a) // a 内层没有找外层 ，a=10
}
var a = 10;
This situation is equivalent to
var a = 10;
function as(){
console.log(a) // a 内层没有找外层 ，a=10
}
function as(){
console.log(a) // undefined
var a = 10
}
var a = 20;
as();
(4) The function declaration is declared before all codes of the function are executed
(5) Local output to find the outer layer
(6) Global
(7)
(8)
(9)
(10)
3. Block-level scope
The middle part of the concept "{}" is block-level scope ex: for while if,
there is no block-level scope in js, but similar functions can be realized with closures.