在前端的学习过程中,在es6中我们会遇见let,const和我们在es5中学到的var有很多的不同。
一、绑定对象方面
我们都知道var定义或者说声明出来的对象,是绑定在顶级对象window上面的,但是let和const不是,这是他们第一个区别
二、块级作用域
let和const拥有块级作用域,但是var没有块级作用域
{
const a = 20;
console.log(a);
}
console.log(a);
此时在中括号内部的输出可以输出,但是中括号外面的输出就会报错,因为const是拥有块级作用域的,在全局中并没有a这个变量,所以浏览器会报错,let同理。
但是把const变成var的时候,就可以拿到a的值了
{
var a = 20;
console.log(a);
}
console.log(a);
三、重复定义
在var中当我们对一个变量进行重复定义的时候,后面的值会覆盖掉前面的值。但是在 let ,const 关键字创建的变量不能重复定义,比如如下代码就会报错,const同理。
let a = 10;
let a = 20;
console.log(a);
var a = 10;
var a = 20;
console.log(a);
当let变成var的时候,就可以正常输出20了
四、预解析
我们都知道var声明的变量或者函数都是具有预解析功能的,即在代码执行前如果遇到var关键字,会把声明提到当前作用于的前面,但是let,const没有预解析。
console.log(a);
var a = 20;
console.log(a);
打印出来的结果就是undefined,20,那为什么第一个打印的时候还没有声明a变量,却没有报错哪,就是因为预解析的原因,提前把var a,提前到console.log()的前面了,所以打印出的是undefined。如果把var换成let或者是const就会报错,因为他们两个没有预解析的功能。
五、let,const的区别
前面说了那么多都是const、let和var的区别,那const和let有什么区别哪?
const声明的变量是只读变量,是不可以被更改的,let可以被更改。但是注意,只是const声明的简单数据类型不可以被更改,但是复杂数据类型是可以被改变的,换句话说就是变量不可以被更改但是内部的结构可以被更改。那是为什么那,因为const不允许改变的原理是改变变量的地址,简单数据类型的变量存储是地址直接指向值,而复杂数据类型存放到堆里,但是地址存到栈里,变量名通过栈里的地址找到堆里的值。
如果想让复杂类型内部也属于只读状态,我们可以通过Object.freeze(obj) 作用是将当前对象冻结。