首页>>前端>>JavaScript->JavaScript的let、var、const声明变量的区别

JavaScript的let、var、const声明变量的区别

时间:2023-11-29 本站 点击:0

前言

在一个项目中,我们会声明很多的变量来存储数据,我们可以把变量当作一个盒子,盒子的名称就是变量名,盒子盛放的东西就是变量的值。

JavaScript中,我们可以使用var,let,const等关键字声明一个变量,如:

vara;//声明一个叫a的盒子a=1;//将数值1放进这个盒子里面//或者vara=1;letb=2;constc=3;

var、let与const之间的区别

在前面的例子,我们分别使用了var,let,const声明了变量,那么使用这三个关键词声明的变量有什么不同呢?下面我们一起来看一下。

var

使用var声明变量,相当于声明一个全局变量,我们知道在浏览器中,window是全局对象,所以全局变量是window对象的属性,因此使用var声明变量,相当于往window对象声明一个属性。

vara=10;console.log(window.a==a);//输出true

没有块级作用域

块级作用域是ES6才有概念,在ES5中,只有全局作用域和函数作用域,因此使用var声明的变量,如果不是在函数内声明,则为全局变量,如果在函数内声明,则为函数内部的局部变量。

{vara=1;//全局变量letb=2;//只在当前作用域有效}console.log(a);//输出1console.log(b);//报错:bisnotdefined

变量提升

console.log(a)vara=1;

上面的例子中,最后输出的值为1,这是因为变量提升,所谓变量提升,是指使用var声明变量时,无论在哪里声明,在解析脚本时,会把所有声明变量的语句一行行先执行,所上面的代码执行顺序是这样的:

vara=1;console.log(a)

允许重复声明

使用var可以重复声明变量,因此下面的语句,在JavaSciprt是允许的:

vara=1;varb=2;

let

letES6新增的用于代替avar关键字,使用let声明的变量,有以下几个特征:

变量不能在声明前使用

变量声明后不能再次声明

不存在变量提升

变量可以有块级作用域

leta=1;leta=2;//再次声明,报错console.log(b);//在声明之前使用,报错letb=2;{letc=3;//只在当前作用域有效}console.log(c);//读取一个未声明的变量,报错

const

const用于声明一个常量,所谓常量,即声明的变量时必须赋值,且在之后使用过程不能重新赋值。

consta=1;consta=2;//重复声明,报错a=2;//重新声明,报错constb;//没有赋初始值,报错

与let一样,const声明的变量,也不存在变量提升,且只在声明后才生效,如果存在块级作用域,在作用域之外则无法读取该变量的值。

另外,前面我们说const声明的变量不允许重新赋值,但如果使用const声明一个对象或数组等引用类型常量,虽然同样无法重新给该常量赋值,但却可以修改对象的属性和数组的元素,如:

consta={x:1,y:2}a.name='test'//给对象添加一个属性,可以执行a={name:'test'}//重新赋值,报错consta=[];a.push('6666');//给数组添加一个元素,可以执行a.length=0;//重置数组的长度,a=['test'];//重新赋值,报错

小结

通过上面几个简单的例子与对比,我们发现,由于历史原因,var声明变量存在许多奇奇怪怪的问题,因为在ES6中引入letconst来声明变量,而letconst声明的变量可有自己的块级作用域,这也有助于程序的模块化。

作者:程序员读书


本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:/JavaScript/666.html