var、let、const

var && let && const

​
对前端感兴趣的可以关注一下我的博客，会持续更新前端相关的知识和学习笔记，一起学习。

在ES6之前，声明变量一直都是使用 var ，ES6新增了 let 和 const，那么它们之间有什么不同呢？

var

使用 var 声明的变量，没有块作用域，可以跨域访问，即：

{
	var a = 1
}
// 在块 {} 外依然可以访问到 a
console.log(a);  // 1

// 循环作用域内也是如此
var i = 5;
for (var i = 0; i < 10; i++){}
console.log(i); // 10

同时，使用 var 声明的变量可以先使用，在声明，即变量提升，并且允许重新声明变量：

console.log(a);  // 这是允许的，但 a 的值为 undefined
var a = 1;

// 重新声明变量
var a = 2;
console.log(a);  // 2

var 声明的全局变量可以属于window对象：

var a = 1;
// 可以使用 window.a 访问
console.log(window.a); // 1
// 使用 window 访问未声明的变量时，不会报错
console.log(window.x); // undefined

let

使用 let 声明的变量拥有块作用域，只能在块作用域内访问：

let a = 1
{
  console.log(a); // 1 这里的 a 是全局变量，因此可以访问
  let x = 2;
}

console.log(x); // x is not defined，x 是在{}内声明的，因此外部访问不到 x

let 声明的变量与 var 不同，不能先使用再声明，必须先声明，再使用：

console.log(a); //  ReferenceError
let a = 1;
console.log(a); // 1

同一作用域或同一块中，不能使用 let 重新声明变量，并且通过 let 声明的全局变量不属于 window 对象：如：

let x = 5;
let x = 10; //  SyntaxError 不允许重新声明变量
// 但不同块或作用域内可以重新声明
{
	let x = 20;
}
// 循环作用域也是如此，同时可以解决使用 var 声明时影响到其他作用域变量的问题
let i = 5;
for(let i = 0; i < 10; i++){}
console.log(i); // 5 for循环内声明的 i 不会影响到全局中的 i
// 不能使用 window.i 访问到 i
console.log(window.i); // undefined

const

const 与 let 类似，但使用 const 声明的变量，必须在声明的同时赋值

const a; // SyntaxError

const a = 1;
a = 5;  // TypeError Assignment to constant variable.
const a = 5; // SyntaxError Identifier 'a' has already been declared

但使用 const 声明的对象或数组，可以添加或更改对象或数值内的值，但不能给对象或数组重新赋值，因为它没有定义常量值。它定义了对值的常量引用。

const lol = ["EZ","VN"];
lol[0] = "Riven";
lol.push("MHT")
console.log(lol); // ["Riven","VN","MHT"]

// 添加或更改对象内的值也是允许的
const LOL = {ADC:"EZ", TOP: "Riven"}
LOL.ADC = "WSC";
LOL.MID = "Faker";
console.log(LOL); {ADC:"WSC", TOP: "Riven", MID: "Faker"}

总结

1. var 声明的变量没有块作用域，但 let 和 const 声明的变量有块作用域。
2. var 声明的变量拥有变量提升，可以先使用，再声明，但 let 和 const 没有，必须先声明，再使用。
3. var 声明的全局变量属于 window 对象，let 和 const 声明的变量不属于，不能通过window访问。
4. 同一作用域或块中，不能使用 let 和 const 重新声明变量，但 var 可以。
5. var 和 let 可以先声明再赋值，但 const 必须在声明时赋值，否则报错。
6. const 声明的变量不能重新赋值，但允许添加或更改对象或数组内的值。