JavaScript中var 和let的区别，四个概念变量提升，作用域，重复声明，暂时死区以及从生命周期去看它

前言

今天无意当中遇到了js中的变量声明，发现除了var居然还有let声明方法，比较新奇，特地记录下来它们两者的区别！绝对能让你理解清楚，PS 后面有重头戏

思路

主要从四个角度来讲述它们的区别

• 变量提升
• 作用域
• 重复声明
• 暂时死区

变量提升

概念：
　　变量的声明会被提升到函数的最顶部，也就是说，可以先使用 再声明。var 可以 let不可以。

a = 1;
var a;
console.log(a);  //1 

b = 1;
let b ;
console.log(b);  // 引用报错

但是变量的初始化 是不能提升的！对var和let处理的方式也是不一样的。

console.log(a);  // undifined
console.log(b);  // 引用报错

var a = 1;
let b = 2;

作用域

概念：
　　var 的作用域不是块级的，也就是说，在一个地方声明，所有的地方都能对它进行读取，而let是块级的

{
    var c =1;

}
{
    let d = 2;
}
console.log(c);  // 1
console.log(d);  // 引用报错

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

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

为了更好的理解，我们直接用{}来表明我们的作用域，可以看到，在{}之外依然能访问var变量而不能访问let变量。

重复声明

概念：
　　var变量能够重复声明，而let变量是无法重复声明的。

var a = 1;
var a = 2;
let c = 1;
let c = 2;  // 报错

暂时死区

知道了变量提升之后，我们可以了解一下暂时死区

console.log(a);  // undefined
console.log(b);  // 引用报错
var a;
let b;

主要就是，生命周期不一样，var变量声明和初始化一起的，而let声明和初始化是分开的，声明和初始化中的区域就叫暂时死区。具体的可以参考这篇声明周期的文章，不再多说了。
声明周期理解的链接

更进一步

原链接：(https://zhuanlan.zhihu.com/p/28140450)
它主要讲的是 var 和 let在for循环中的问题，可以看看，还有let是否真的是不能提升。