变量提升的原理

当程序执行这一段代码时

console.log(a);
var a = 2;

有经验的同学都知道控制台会输出undefined而不是报错a is not defined
这是因为此时发生了变量提升，代码可以理解为以下形式

var a;
console.log(a);// undefined
a = 2;

这是为什么呢，让我先说明以下几点

• 一段JavaScript代码，是先由编译器编译成可执行代码，再交给引擎去执行的。
• 用var关键字声明的变量是在编译阶段声明的。

每当编译器遇到var xxx，都会去查找当前作用域是否已存在变量xxx，如果xxx已存在，则忽略该声明，反之，在当前作用域声明变量xxx。
所以当成程序执行下面代码时

console.log(a);
var a = 2;

1. 首先编译器编译var a = 2;时，会查找当前作用域是否存在变量a，发现a并不存在，声明变量a。
2. 再由引擎执行由编译器生成的代码，此时变量a已经被编译器声明,但是还未被赋值，所以此时控制台输出的值是undefined。
3. a = 2，此时变量a的值为2。

其实关键点就在于，由var关键字声明的变量是在编译阶段声明的，所以会出现变量提升的情况。
但是编译器对ES6语法中的const和let关键字声明的变量则不会提前声明，所以不会出现变量提升。