JavaScript中var、let、const三者的区别

在ES6发布之前，JavaScript的作用域有全局作用域和函数内部作用域两部分，没有块级作用域一说。
块级作用域一般由{ }包括，if 和 for 里的{ }同样为块级作用域。

初学JS最常见的变量修饰符就是var了，var定义的变量区别也主要体现在全局变量和局部变量上。

// 函数内部用var修饰，外部不能使用
function methodOne(){
	var a = "Tom";
}

var a = "Tom";
function methondTwo(){
	console.log(a);//var定义全局变量，函数内部能够使用。
}

for(var i = 0; i < 2 ; i++){
	var a = "a";
}
console.log(a);

跳出 for 循环后仍旧能访问变量 a 以及变量 i 。

for (var i = 0; i < 3; i++) {
      setTimeout(function () {
        console.log(i)
      }, 1000);
 }

上述代码在运行过程中，输出结果为3个3，而非预想的 0 ，1 ，2。
实际运行过程中，循环过程以及三次timeout回调过程均在共享唯一变量 i 。循环结束时，i 为3，第一次timeout调用 i 时，调用的 i 已经为3了。

因此 let 的出现就是为了解决这些问题出现的。

相对于var定义变量能跨块进行访问，let定义的变量只能在块作用域 { } 内进行访问，不能跨块进行访问，更不能跨函数进行访问。

var i = 3;
for( var i = 0; i < 5 ; i++){
	...
}  
console.log( i );//输出为5
let j = 2; 
for(let j = 0; j < 4 ; j++ ){
	...
}
console.log( j );//输出为2

let 声明的变量拥有块级作用域
let 声明的全局变量不是全局对象的属性
在JavaScript中，全局作用域指的是JavaScript环境，而在HTML中，全局作用域针对的window环境。
var 声明的全局作用域属于window对象，而 let 声明的全局作用域不属于window对象，你不可以通过window.变量名的方式访问这些 let 定义的变量。它们只存在于一个不可见的块的作用域中，这个块理论上是Web页面中运行的所有JS代码的外层块。
形如 for(let x …)的循环在每次迭代过程都为 x 创建新的绑定
变量重置
- var 声明的变量在任何地方都可以修改
- 相同作用域或者块级作用域中，不能用 let 关键字重置 var / let 声明的变量
- 相同作用域或者块级作用域中，不能用 var 来重置 let 声明的变量。
- let 关键字在不同的作用域或者不同的块级作用域中可以重新声明赋值

var a = 2;
var a = 3;//正确

var x = 2;
let x = 3;//不合法
{
	var a = 2;
	let a = 3;//不合法
}
{
	let b = 2;
	let b = 3;//不合法
}
let c = 3;
var c = 2;//不合法

let d = 2;
{ 
	let d = 3;//合法
}

const 是用来定义常量的，声明时候必须初始化（所以单纯声明常量是不行的），且初始化后的值不能再进行修改。

const a;//不合法的
const b = 2;//合法的

const的本质：const 定义的变量并非常量，并不是不可变，它定义了一个常量引用一个值，即定义的是指向变量的指针。使用 const 定义的对象或者数组，其实是可变的，例如可以改变对象的属性。 修改对象属性的过程中并不改变指向对象的指针，所以是合法的。

const car = {color : "red", size: "big"};
car.color = "blue";
car.size = "small";//合法

const 在重置变量和变量提升上的要求与 let 类似：

重置变量
- 在相同的作用域或块级作用域中，不能使用 const 来重置var、let 以及 const 关键字声明的变量。
- const 在不同作用域，或不同块级作用域中是可以重新声明赋值的

var a = 2;
const a = 3;//不合法
{
	const b = 4;
	const b = 5;//不合法
	var b = 4;//不合法
	const a = 5;//合法
}

来源：CSDN

作者：San Sorray

链接：https://blog.csdn.net/weixin_43831038/article/details/104733430

标签