js 中const、var、let区别

js中const、var、let都是申明变量的关键字，但是在使用中很多初学js的同学来说，这几个的作用还是没有搞清楚，在实际开发中根据自己的习惯在用，而不是根据具体关键字的作用来用。这就会导致在写程序的时候容易出现报错，而且让代码看起来特别混乱。

#####一、三个变量的区别

1.const定义的变量不可以修改，而且必须初始化。

注意：这里的变量只是指简单类型变量（数值、字符串、布尔值），对于复合型变量（主要是对象和数组）除外，因为严格的说是这个变量所对应的内存地址是不能改变的。具体关于const详细介绍可以查阅ES6标准文档。

```javascript
const b = 2;//正确
// const b;//错误，必须初始化 
console.log('函数外const定义b：' + b);//有输出值
// b = 5;
// console.log('函数外修改const定义b：' + b);//无法输出 
2.var定义的变量可以修改，如果不初始化会输出undefined，不会报错。

var a = 1;
// var a;//不会报错
console.log('函数外var定义a：' + a);//可以输出a=1
function change(){
　　a = 4;
　　console.log('函数内var定义a：' + a);//可以输出a=4
} 
change();
console.log('函数调用后var定义a为函数内部修改值：' + a);//可以输出a=4
3.let是块级作用域，函数内部使用let定义后，对函数外部无影响。

let c = 3;
console.log('函数外let定义c：' + c);//输出c=3
function change(){
　 let c = 6;
　 console.log('函数内let定义c：' + c);//输出c=6
} 
change();
console.log('函数调用后let定义c不受函数内部定义影响：' + c);//输出c=3
```

#####二、变量提升

变量提升就是变量的声明会被提升到函数的最顶部，也就是说，可以先使用再声明。let和const都不存在变量提升，只有var才存在变量提升。

```javascript
a = 1;
var a;
console.log(a);  //1 
b = 1;
let b ;
console.log(b);  // Uncaught ReferenceError: Cannot access 'b' before initialization
注意：变量都初始化是不能提升的，对var虽然不会报错，但是会输出undifined，而let就不用说了，直接报错。

// var 的情况
console.log(foo);  // undefined
var foo = 2;

// let的情况；
console.log(bar);  // Uncaught ReferenceError: Cannot access 'b' before initialization
let bar = 2;
```
#####三、作用域

在js中，作用域分为"全局变量"（也就是定义在全局代码中的变量）和"局部变量"（指的是在某个函数中定义的变量）。在js中，变量的定义并不是以代码块作为作用域的，而是以函数作为作用域。也就是说，如果变量是在某个函数中定义的，那么，它在函数以外的地方是不可见的。但是，如果该变量是定义在if或者for这样的代码块中，它在代码块之外是可见的。

```javascript
{    
    var c =1;
}
{
    let d = 2;
}
console.log(c);  // 1
console.log(d);  // Uncaught ReferenceError: d is not defined

var a = 1;
{
    var a = 2;
}

let b = 1;
{
    let b = 2;
}
console.log(a);  // 2
console.log(b);  // 1

//计数器i只在for循环体内有效，在循环体外引用就会报错
for (let i = 0; i < 10; i++) {
  console.log(i);
}
console.log('aaa');
console.log(i); // i is not defined

//变量i是var声明的，在全局范围内都有效，所以每一次循环，新的i值都会覆盖旧值，导致最后输出的是最后一轮i的值。
var a = [];
for (var i = 0; i < 100; i++) {
  a[i] = function() {
    console.log(i);
  }
}
a[6](); // 100
//但是如果使用let，声明的变量仅在块级作用域内有效，最后输出的是6。
var b = [];
for (let j = 0; j < 100; j++) {
    b[j] = function() {
        console.log(j);
    }
}
b[11](); // 11
```
#####四、重复声明

let不能在同一作用域下重复声明同一个变量，而var是可以的。

```javascript
function fun(){
    var a = 10;
    var a = 100;
    console.log(a)
}
fun()//100
function fun01(){
    var a = 10;
    let a = 100;
    console.log(a)
}
fun01()//Uncaught SyntaxError: Identifier 'a' has already been declared
function fun02(){
    let a = 10;
    let a = 100;
    console.log(a)
}
fun02()//Uncaught SyntaxError: Identifier 'a' has already been declared
function fun03(){
    let a = 10;
    var a = 100;
    console.log(a)
}
fun03()//Uncaught SyntaxError: Identifier 'a' has already been declared
```
#####五、暂时死区

主要就是，生命周期不一样，var变量声明和初始化一起的，而let声明和初始化是分开的，声明和初始化中的区域就叫暂时死区。

```javascript
var name = '张三';
if (true) {
    tmp = '李四';
    let tmp;
    console.log(tmp); // tmp is not defined
}
```