在JavaScript中,let
、const
和 var
是用来声明变量的关键字,但它们之间在作用域、变量提升、重复声明等方面存在区别,详细情况如下:
1. let
、const
、var
的区别
(1) 块级作用域
-
let
和const
:具有块级作用域,由{}
包括。这解决了ES5中内层变量可能覆盖外层变量和循环变量泄露为全局变量的问题。
if(true){
let a="hello world";
console.log(a);//hello world
}
//console.log(a);//报错,ReferenceError: a is not defined
//因为let、const在块外部不可见
-
var
:不具备块级作用域,只有函数作用域或全局作用域。
if(true){
var b="hello world";
console.log(b);//hello world
}
console.log(b);//hello world
//因为var声明的变量在函数作用域或全局作用域内有效
(2) 变量提升(var特有)
var
:存在变量提升,即变量可以在声明之前使用,但值为undefined
。
console.log(x); // undefined
var x = 10;
//因为var声明的变量会被提升
let
和const
:不存在变量提升,必须在声明后才能使用,否则报错。
console.log(y); // 报错,ReferenceError: Cannot access 'y' before initialization
let y = 10;
//因为let、const声明的变量不会被提升
(3) 全局属性
var
:声明的全局变量会成为全局对象(浏览器中是window
,Node中是global
)的属性。let
和const
:不会将声明的全局变量添加到全局对象的属性上。
(4) 重复声明
var
:允许在同一作用域内重复声明变量,后声明的会覆盖前面声明的。
var c = 1;
var c = 2;
console.log(c); // 2
let
和const
:不允许在同一作用域内重复声明变量。
let d = 1;
let d = 2; // 报错,SyntaxError: Identifier 'd' has already been declared
const e = 1;
// const e = 2; // 报错
//因为let、const不允许在同一作用域内重复声明变量
(5) 暂时性死区(let、const特有)
let
和const
:在声明前使用会报错,因为这段时间称为暂时性死区。
if (true) {
console.log(f); // 报错,因为f在声明之前处于暂时性死区
let f = 'temporal dead zone';
}
// const的情况与let相同,也会存在暂时性死区
var
:不存在暂时性死区。
(6) 初始值设置
var
和let
:可以不设置初始值。
var g; // 未初始化
console.log(g); // undefined
let h; // 未初始化,但在使用前必须声明
console.log(h); // undefined
const
:必须设置初始值。
// const i; // 报错,因为const必须设置初始值
const j = 10;
console.log(j); // 输出 10
(7) 指针指向
let、var
:创建的变量可以重新赋值,即可以更改指针指向。const
:声明的变量不允许改变指针的指向,但如果是对象或数组,可以修改其内部属性或元素。
2. const
对象的属性可以修改
const
保证的是变量指向的内存地址不变,即不能重新指向另一个对象或数组。
但对于对象或数组这样的引用类型,const
只能确保引用(指针)不变,而不能保证对象内部状态的不可变性。
因此,可以修改 const
声明的对象的属性或数组的元素。
const obj = { value: 10 };
obj.value = 20; // 可以修改const声明对象的属性
console.log(obj.value); // 20
// obj = { value: 30 }; // 报错,因为尝试改变了const声明的对象的引用
3.其他说明
(1)变量提升是var
特有的,且只影响函数作用域或全局作用域;而暂时性死区是let
和const
特有的,与它们的块级作用域紧密相关。
(2)const
用于声明一个只读的常量。一旦一个常量被赋值后,它的值就不能再被改变。但是,如果常量是一个对象或数组,其内部状态仍然可以被修改,只是常量指向的内存地址不能改变。使用const
可以提高代码的可读性和可维护性,因为它明确表示了某些值是不应该被改变的。
(3)使用var
在全局作用域中声明的变量会自动成为全局对象(在浏览器中是window
,在Node.js中是global
)的属性。这可能会导致意外的全局变量污染和命名冲突。所以使用let
和const
在全局作用域中声明的变量则不会成为全局对象的属性,这有助于减少全局命名空间的污染。
(4)由于let
和const
提供了更好的封装和避免命名冲突的能力,它们通常被认为是更好的选择。
总结
区别 | let | const | var |
---|---|---|---|
有无块级作用域 | √ | √ | × |
有无变量提升 | × | × | √ |
能否添加全局属性 | × | × | √ |
能否重复声明变量 | × | × | √ |
有无暂时性死区 | √ | √ | × |
必须设置初始值 | × | √ | × |
能否改变指针指向 | √ | × | √ |