一、var
在es5中,顶层对象的属性和全局变量是等价的,用var声明的变量既是全局变量,也是顶层变量
⚠️:顶层对象指window对象,在node指global对象
var a = 10;
console.log(window.a)//10
使用var声明的变量存在变量提升的情况
console.log(a)//undefined
var a = 20
在编译阶段,编译器会将其变成以下执行
var a
console.log(a)
a = 20
使用var,我们能够对一个变量多次申明,后面声明的变量会覆盖前面的变量声明
var a = 20
var a = 30
console.log(a) //30
在函数中使用var声明变量时,该变量是局部的
var a = 20;
function change(){
var a = 30
}
change()
console.log(a)//20
而如果在函数内不使用var,该变量是全局的
var a = 20 ;
function change(){
a = 30
}
change()
console.log(a)//30
二、let
let是es6新增的命令,用来声明变量
用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效
且不存在变量提升,只要会计作用域存在let命令,这个区域就不再受外部影响
var a = 123
if (true){
a = 'abc'//ReferenceError
let a;
}
使用let声明变量前,该变量都不可用,也就是大家常说的“暂时性死区”
最后,let不允许在相同作用域中重复声明
let a = 20
let a = 30
//Uncaught SyntaxError : Identifier 'a' has already been declared
注意的是相同作用域,下面不会:
let a = 20
{
let a = 30
}
所以,我们不能在函数内不重新声明参数
三、const
const声明一个只读的常量,一旦声明,常量的值就不能改变
const a = 1
a = 3
//TypeError : Assignment to constant variable.
这意味着,const一旦声明变量,就必须立即初始化,不能留到以后赋值
如果之前用var 或 let 声明过变量,在用const声明同样会报错
var a = 20
let b = 20
const a = 30
const b = 30
//都会报错
const实际上保证的并不是白娘的值不得改动,而是变量指向的那个内存地址所保存的数据不得改动
对于简单类型的数据,值就保存在变量指向的那个内存地址,因此就等同于一个常量
对于复杂类型的数据,变量指向的内存地址,保存的只是一个追昂实际数据的指针,const只能保证这个指针是固定的,并不难确保变量的结构不变
const foo ={};
//为 foo 添加一个属性
foo.prop = 123;
foo.prop //123
//将foo 指向另一个对象,就会报错
foo ={};//TypeError: "foo" is read-only
其他情况的话,const与let一致
四、区别 :
- 变量提升
- 暂时性死区
- 块级作用域
- 重复声明
- 修改声明变量
- 使用
结论:能用const的情况尽量使用const,其他情况下大多数使用let,避免使用var