update：
2017-10-23 更新了文中一些表达以及添加了JS编译部分的理解。
2018-06-06 这篇文章能更好的理解ES6的let和const理解ES6中的暂时死区(TDZ)
先前看到方方老师最新的文章《我用了两个月的时间才理解 let》，以下是对该文章的学习结合自己理解总结的笔记。
由于自己对JavaScript的编译和运行理解的不是非常深，文中对于JavaScript引擎的编译部分的理解可能并不准确，如有问题欢迎提出！
var let function const声明的过程
首先，需要明白，JavaScript在准备阶段会由JavsScript引擎进行编译的，编译的过程包括进行词法分析（词法作用域）及代码生成。当前面的准备完成后通常会立即执行代码。
对于变量声明来说，一般可以简单的分为三个过程：
- create创建 (编译)
- initialize初始化 （编译）
- assign赋值 （执行代码）
需要注意，初始化当中也可以进行赋值。
var
// 通过fn限定作用域
function fn(){
console.log(x) // 结果为undefined
var x = 1
var y = 2
}
fn()
// 1. 找到fn作用域中所有var声明的变量，create变量(x和y)
// 2. initialize变量x,y为undefined
// 3. 开始执行代码 x = 1 ，将变量 x assign为 1
// 4. y = 2 将变量 y assign为 2
// 可以理解为下面的情况
var x
var y
x = 1
y = 2
基本过程：
1.找到所有var，「创建」变量
2.「初始化」变量并赋值undefined
3.「执行代码」，根据执行的代码开始为变量「赋值」。
在这个过程中产生了一个像是声明提升到作用域顶部的现象，因此会出现在var x = 1之前console.log(x)。
ps：从文章中学习到，声明提升其实并非是一个官方说法。
function
// 假设全局作用域下
fn2 ()
function fn2(){
console.log(2)
}
// 1. 找到当前作用域中所有的function声明的变量，为当前环境create这些变量（声明fn2）。
// 2. 初始化这些变量(fn2)并赋值为 function(){ console.log(2) }
// 3. 执行代码fn2()
基本过程：
- 会先找到所有
function关键字的函数声明进行「创建」 - 进行「初始化并赋值」的操作
- 「执行」代码
fn2()，因此产生了函数提升的过程
需要注意的是，这里特指函数声明。
let
function fn3(){
let x = 1
x = 2
}
fn3()
// 1. fn3()作用域中找到所有的let声明的变量并创建它
// 2. 开始执行代码 （与var 不同，这里还没初始化）
// 3. 执行x = 1 ，x 「初始化」为 1（这并不是一次赋值，如果代码是 let x，就将 x 初始化为 undefined）
// 4. 执行 x = 2，为x进行赋值
根据这个区别，let的初始化是在执行代码的过程中，而不是先初始化：
- 找到所有
let「创建」变量。 - 开始「执行」代码，使变量根据执行的代码「初始化并赋值」，此时如果没有赋值（比如：
let x）则「初始化」为undefined。 - 继续执行代码。
由于let的初始化和赋值操作是在代码执行阶段，所以对let声明的变量的使用必须在声明后，也就没有出现声明提升的现象。
const
function fn4(){
const x = 1
x = 3 // Uncaught TypeError: Assignment to constant variable.
}
fn4()
// 1. fn4的作用域中找到所有const声明的变量，并创建它（创建x）
// 2. 为变量初始化 (变量x 初始化为3)
// 3. 执行代码x = 3 ，报错
const和let 主要区别在于const声明的变量无法赋值，同时const必须在执行初始化的时候赋值，否则会抛出错误Uncaught SyntaxError: Missing initializer in const declaration
let与var区别：
- var 的创建与初始化都提升了
- let 的创建提升了，但是初始化没有提升
- function 的创建、初始化、赋值都被提升了
因此在let初始化之前使用其声明的变量，就会出现变量没有定义的错误：
function fn5(){
console.log(x) // Uncaught ReferenceError: x is not defined
let x = 1
}
fn5()
小结
对于上面的结论，我们对JavaScript变量声明做一些总结。
创建：在编译阶段通过词法分析，对关键字(var,let,const,function)进行变量创建
表现为变量提升到作用域顶端进行创建
初始化：仍在编译阶段，不同关键字初始化方式不同，主要操作是为变量赋值：
var：创建后初始化为undefined
let：执行代码阶段进行初始化，如果没有赋值则初始化为undefined
function：函数声明表达式为var的形式提升到作用域顶端创建，并同时初始化，赋值为一个函数对象
const：创建后，执行代码阶段进行初始化，同时必须赋值
执行代码阶段：
var：创建变量时已进行了第一次初始化
let：关键字后为第一次执行，第一次执行时才进行初始化，可以不赋值，不赋值则为初始化为undefined
function：
const：关键字后第一次执行代码，必须赋值
- 所有变量声明方式都会将变量提升到作用域顶端，并进行创建
- 初始化的表现使得变量声明不同，产生了变量提升的现象
其他相关
参考文章和知乎上的知识，各浏览器在console上表现并不是一致的
比如上图中的问题，在chrome的console中，有以下的情况：
- 当 let声明变量x如果初始化失败了，就会处于一种已创建的状态
- 此时无法再次对x进行初始化，即初始化机会只有一次
- 此时x将处于暂时死区（temporal dead zone）
- 于是，此状态下的x将是不可用的
但是对于其他浏览器可能报错信息将不一致，具体可以参照问题中贺老的回答。
参考：
https://zhuanlan.zhihu.com/p/28140450
https://www.zhihu.com/question/62966713
