JS中 var,let与const的区别
1.在ES6(ES2015)出现之前,JavaScript中声明变量就只有通过 var 关键字,函数声明是通过 function 关键字,而在ES6之后,声明的方式有 var 、 let 、 const 、 function 、 class ,该文主要讨论 var 、 let 和 const 之间的区别。
2.首先让我们来体验一下let主要是干嘛的
2.1 let主是用来声明变量的,但是let声明的关键是具有块级作用域的,而var声明的变量是不具备这个特点的。那么何为块级作用域呢?块作用域由 { } 包括,if语句和for语句里面的{ }也属于块作用域。
那还是看代码体验把:
<script>
if (true) {
var a = 50;
let b = 10;
console.log(b);
console.log(a);
}
console.log(a);
console.log(b); //该打印是会报错的,就是因为let有块级作用域
</script>
结果如下:
2.2 使用let声明变量,防止循环变量变成全局变量,而var也不具备这个特点
代码:
<script> for (var i = 0; i < 3; i++) { } console.log(i); for (let j = 0; j < 3; j++) { } console.log(j);//会报错 </script>
结果如下:
2.3使用let关键字不存在变量提升(即不能先使用后声明),也会存在暂时性死区(即在一个块级作用域起作用,不会收到外部有同样名字的变量影响)
请看代码:
<script> // console.log(a);//会报错 // let a = 100; var num = 10; if (true) { console.log(num);//会报错 let num = 10; } </script>
结果:
3.const:是用来声明常量的(即内存地址不能变化的量)
3.1 const 也是具有块级作用域的
代码体验:
<script> if (true) { const num = 10; if (true) { const a = 20; console.log(a); } console.log(num); } console.log(num); //会报错 </script>
结果如下:
3.2 const声明的常量值是不能更改的(分为2种情况,即基本数据类型与复杂数据类型)
看代码体验:
<script> // const pi = 3.14; // pi = 5 // console.log(pi); const arry = [100, 200]; arry[0] = 50; arry[1] = 80 console.log(arry); //没有改变该数组的内存地址,可以打印 arry = [1, 2] //已经更改了内存地址,会报错 console.log(arry); </script>
结果如下:
注意点:const关键字声明的常量必须得有初始值,否则也会有报错
总结:最后用一个表来总结一下它们三者的区别与联系,请看下图:
最后的话,如果您在阅读过程中发现有错误的话,还请各位大佬多多指正!
参考链接:https://www.bilibili.com/video/BV1gV411q7cz?p=99&share_source=copy_web