JS局部变量、全局变量、局部作用域、全局作用域以及块级作用域结合ES6讲解
程序员文章站
2024-03-19 14:06:40
...
1.在JavaScript中定义变量有两种方式
ES6之前:var 变量名称;
ES6开始:let 变量名称;
2.两种定义变量方式的区别
详细介绍见https://blog.csdn.net/Cao_Mary/article/details/89207605
2.1、是否能够定义同名变量
var可以定义,let不可以定义同名变量
2.2、是否能够先使用后定义
var可以先使用后定义(预解析),let不可以预解析
2.3、是否能被{}限制作用域
无论是通过var还是let定义在{}外面都是全局变量
var放在{}内部还是全局变量,let放在{}内部则是局部变量
无论是通过var还是let定义在局部作用域的都是局部变量
3.局部作用域、全局作用域、块级作用域
- 3.1、在任何地方都可以访问到的就是全局作用域。在JavaScript中{}外面的作用域,称之为全局作用域
- var和let变量在全局作用域中都是全局变量
- 3.2、只在固定的代码片段内可访问到的变量,例如函数内部。对应局部作用域(函数作用域)。在JavaScript中函数后面{}中的作用域,称之为“局部作用域”
- 无论是通过var还是let定义在局部作用域的都是局部变量
- 3.3、任何一对花括号({和})中的语句集都属于一个块,在这之中定义的所有变量在代码块外都是不可见的,我们称之为块级作用域。在ES6中只要{}没有和函数结合在一起,那么应该是“块级作用域”。ES6之前没有块级作用域。
- 块级作用域中,var定义的变量是全局变量,let定义的变量是局部变量
4.块级作用域和局部作用域区别
4.1、在块级作用域中通过var定义的变量是全局变量
{
//块级作用域
var num = 123;//全局变量
}
console.log(num);
4.2、在局部作用域中通过var定义的变量是局部变量
function test() {
var value = 666;//局部变量
}
test();
console.log(value);//value is not defined
5、无论是在块级作用域还是局部作用域,省略变量前面的let或者var就会变成一个全局变量。
5.1、验证在块级作用域中
{
var num1 = 678;//全局变量
let num2 = 678;//局部变量
num3 = 678;//局部变量
}
console.log(num1);//678
console.log(num2);//num2 is not defined
console.log(num3);//678
5.1、验证在局部作用域中
function f() {
var num1 = 678;//局部变量
let num2 = 123;//局部变量
num3 = 456;//全局变量
}
f();
console.log(num1);//num1 is not defined
console.log(num2);//num1 is not defined
console.log(num3);//456
6、案例
var num1 = 123;//**全局变量**
function f() {
var num2 = 456//局部变量
}
function test() {
num3 = 666;//局部作用域,没有var或者let修饰。**全局变量**
}
{
var num4 = 789;//块级作用域、**全局变量**
}
{
let num5 = 789;//块级作用域、let定义变量。局部变量
}
{
let value7 = 123;
{
//注意点:在不同的作用域范围中,可以有同名变量
let value7 = 456;//不会报错。
}
}
下一篇: XSS漏洞修复方案