var,let,const 三者的特点和区别
# var 的特点
- 存在变量提升
console.log(a); // undefined
var a = 10;
// 编译过程
var a;
console.log(a); // undefined
a = 10;
1
2
3
4
5
6
7
2
3
4
5
6
7
- 一个变量可多次声明,后面的声明会覆盖前面的声明
var a = 10;
var a = 20;
console.log(a); // 20
1
2
3
2
3
- 在函数中使用 var 声明变量的时候,该变量是局部的
var a = 10;
function change(){
var a = 20;
}
change();
console.log(a); // 10
1
2
3
4
5
6
2
3
4
5
6
- 如果在函数内不使用 var,该变量是全局的
var a = 10;
function change(){
a = 20
};
change();
console.log(a); // 20
1
2
3
4
5
6
2
3
4
5
6
# let 的特点
- 不存在变量提升,let 声明变量前,该变量不能使用(暂时性死区)。
console.log(a); // ReferenceError: a is not defined
let a = 10;
1
2
2
- let 命令所在的代码块内有效,在块级作用域内有效
{
let a = 10;
}
console.log(a); // ReferenceError: a is not defined
1
2
3
4
2
3
4
- let 不允许在相同作用域中重复声明,注意是相同作用域,不同作用域有重复声明不会报错
let a = 10;
let a = 20;
// Uncaught SyntaxError: Identifier 'a' has already been declared
let a = 10;
{
let a = 20;
}
// ok
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
# const
- const 声明一个只读的变量,声明后,值就不能改变
const a = 10;
a = 20; // TypeError: Assignment to constant variable.
1
2
2
- const 必须初始化
const a; // SyntaxError: Missing initializer in const declaration
const a = 10; // ok
1
2
2
- const 并不是变量的值不能改动,而是变量指向的内存地址所保存的数据不得改动
const obj = {
age: 17
}
obj.age = 18; // ok
obj = {
age: 18
}
// SyntaxError: Identifier 'obj' has already been declared
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
- let 该有的特点 const 都有
# 区别
- 变量提升
var 声明的变量存在变量提升,即变量可以在声明之前调用,值为 undefined
let 和 const 不存在变量提升,即它们所声明的变量一定要在声明后使用,否则报错
- 块级作用域
var 不存在块级作用域
let 和 const 存在块级作用域
- 重复声明
var 允许重复声明变量
let 和 const 在同一作用域不允许重复声明变量
- 修改声明的变量
var 和 let 可以
const 声明一个只读的常量。一旦声明,常量的值就不能改变,但对于对象和数据这种引用类型,内存地址不能修改,可以修改里面的值。
# 使用
能用 const 的情况下尽量使用 const,大多数情况使用 let,避免使用 var。使用优先级:
const > let > var
1
const 声明的好处,一让阅读代码的人知道该变量不可修改,二是防止在修改代码的过程中无意中修改了该变量导致报错,减少 bug 的产生。let 声明没有产生预编译和变量提升的问题,先声明再使用可以让代码本身更加规范,let 是个块级作用域,也不会污染到全局的变量声明。
最后说一点就是使用的场景说明:let 一般应用于基本数据类型;const 一般应用于引用数据类型,也就是函数对象等。
编辑 (opens new window)
上次更新: 2024-07-15, 03:27:09