ES6系列(一)let和var的区别

在之前的js版本中,声明变量一直都是用var, 这个估计大家都很熟悉了,那么它的作用呢就是用来声明一个变量,比如像这样子:

var a = 10;

在这里我们就用var声明了一个变量a  并且在声明的同时给这个变量a赋值了  也就是10; 那么这时候如果我们去引用这个变量,那么得到的结果就是10,这没什么稀奇的,在这里就不再赘述了。

那么在es6里面新增了两个声明变量的方法,一个是let,用于声明变量。一个是const,用于声明常量。我们来看一下这三者之间的区别

let和var的区别

这两个关键字都是用于声明变量的,在这种情况(先声明后使用)下使用let和var的时候其实是没有区别的。

var a = 10;
let b = 20;

console.log(a,b);// 10 20

区别一:变量提升    用var声明的变量会被提升,而用let声明的变量不会被提升                                                                                      不过呢,我们都知道var关键字声明变量的时候有一个东西,叫“变量提升”;也就是将变量声明提升到它所在作用域的最开始的部分,比如:

console.log(a); //undefined
var a = 10;

如果在声明这个变量之前去引用这个变量,如果这个变量是用var进行声明的,那么得到的结果其实是undefined,也就是为定义的意思,但是这个变量是存在的。我们知道js在运行之前其实有一个与解析的过程,所以上面代码在js去进行解析的时候,其实变成了这样:

var a;
console.log(a);//undefined
a = 10;

可以看到变量a的声明跑到console.log的前面去了,只是赋值还是在console.log之后进行赋值的,console.log得到的结果就是undefined.  这就是所谓的变量提升了。

这时候区别就来了:用var声明的变量会被提升,而用let声明的变量不会被提升   也就是说:

console.log(b);//error:b is not defined
let b = 20;

在声明之前去引用let声明的变量会直接报错,会直接阻断程序的运行。

区别二:重复声明  用var可以重复声明同一个变量,而let不可以                                                                                                             我们知道,用var声明一个变量之后,其实还可以再次用var去声明这个变量,不过是后者覆盖前者,并没有太大意义。不过至少不会报错,而如果用let去声明变量的话,就得稍微注意一点,因为let不可以在同一个作用域下重复声明同一个变量:     

var a = 10;
var a = 20;

let b = 10;
let b = 20;//error : Identifier 'b' has already been declared

如果用let重复声明同一个变量,那么这时候就会报错:变量b已经被声明了。

区别三:块级作用域  用let声明的变量支持块级作用域                                                                                                                              es6新提出来了一个块级作用域的概念,在之前,作用域只存在函数里面,或者全局。而es6提出的块级作用域则是一个大括号就是一个块级作用域,也就是说if语句里面都存在作用域概念了,比如:

if(true){
    var a = 12;
}
console.log(a);// 12


if(true){
    let b = 123;
}
console.log(b);//  error : b is not defined

const的特性

和let一样,const也是es6新增的关键字,let用于声明变量,而const用于声明常量。当然,const和let也有一些相同点:                       1,const 不会变量提升,准确来说应该是常量提升,也就是说不会被提前与解析                                                                             2,const 不能重复声明同一个常量                                                                                                                                                     3,const 支持块级作用域

然后我们再来说一下这两个家伙的不同点:

区别一:const声明的常量不能被修改 

正常来说,我们不管是用var声明的变量,还是用let声明的变量,后期都是可以对这个变量再次赋值的,也就是说可以修改。而常量一旦定义了,后期就不能修改了。如:

const pi = 3.1415926;
pi = 123;//error : Assignment to constant variable

一旦你尝试着去修改一个常量的时候,浏览器就会告诉你,常量不可以被修改!

不过有一个方法是可以做到修改常量的,就是声明常量的时候,给常量赋值一个对象,然后后期再去修改这个对象里面的值就可以了,不过这么做没有任何的意义,常量存在的意义就在于其不可更改性。所以这个方法也就不再多说了

 

区别二:常量在声明的时候,必须赋值

 其实这一点特别好理解,常量在后期没有办法再次进行赋值,所以只能在声明的时候进行赋值

另外有一点要特别关注一下,比如:

var abc= 123;
if (true) {
    abc= 'rstyjstyjd'; // referenceError
    let abc;
}

在上面的代码中,存在全局变量abc, 但是块级作用域内let又声明了一个变量abc, 导致后者绑定这个块级作用域,所以在let变量声明之前,对tmp的赋值会报错。

ES6中明确规定,如果区块中存在let和const命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域,凡是在声明之前就使用这些变量就会报错。

那么以上就是关于es6在变量声明这一块的小改动啦!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值