JavaScript代码在执行时并不完全是由上到下一行一行执行的，由此产生了一个提升的问题。

什么是提升

可以简单理解为：声明(变量和函数)都会被“移动”到各自作用域的最顶端,这个过程被称为提升。

具体例子看提升

下面两个例子a会LOG什么出来呢？

a = 233;
VAR a;
console.log(a)

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

“看起来”第一个例子应该log出undefined，第二个例子变量a在使用前没有先进行声明,因此会抛出ReferenceError异常。但实际上，第一个例子a输出233，第二个例子a输出undefined。

为什么？

在知道为什么之前有必要了解：JavaScript虽然是解释型语言，但在解释JavaScript代码之前首先对其进行编译的。编译阶段中的一部分工作就是找到所有的声明,并用合适的作用域将它们关联起来。

变量和函数在内的所有声明都会在任何代码被执行前首先被处理。

var a = 233;

上面的声明看起来是一个声明，而对于JavaScript而言实际上这是两个声明：var a;和a = 233;。第一个定义声明是在编译阶段进行的。第二个赋值声明会被留在原地等待执行阶段。

看回前面两个例子，第一个例子的代码会被这样处理：

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

第二个例子：

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

注意：只有声明本身会被提升,而赋值或其他运行逻辑会留在原地 。

函数声明与函数表达式

第一个例子：

foo();
function foo() {
  console.log(a); // undefined
  var a = 233;
}

函数foo可以正常执行。
第二个例子：

foo(); // TyPEError
var foo = function bar() {
  // ...
}

报错：Uncaught TypeError: foo is not a function

由此可以看到：函数声明会被提升,但是函数表达式却不会被提升。
第三个例子：

foo(); // TypeError
bar(); // ReferenceError
var foo = function bar() {
  // ...
};

这段代码经过提升后,可以理解为以下形式:

var foo;
foo(); // TypeError
bar(); // ReferenceError
foo = function() {
  var bar = ...self...
  // ...
};

由此可见：具名的函数表达式,名称标识符在赋值之前也无法在所在作用域中使用。

函数优先

既然函数声明和变量声明都会被提升，那么问题来了，重复声明的代码中的优先级是怎样的，是函数声明被提升还是变量声明被提升？
继续验证：

foo(); // 1
var foo;
function foo() {
  console.log( 1 );
}
foo = function() {
  console.log( 2 );
}

var foo尽管出现在 function foo()...的声明之前，但它是重复的声明而被忽略，因为函数声明会被提升到普通变量之前。可以得知：函数声明提升的优先权大于普通变量声明。

尽管重复的var声明会被忽略掉,但出现在后面的函数声明还是可以覆盖前面的：

foo(); // 3
function foo() {
  console.log( 1 );
}
var foo = function() {
  console.log( 2 );
};
function foo() {
  console.log( 3 );
}

ES6中的变量声明

ES6新增了let、const声明，它们会存在一个暂时性死区（TDZ），表现出的情况会有所不同，具体可以参考：let, const

总结

• var变量声明和函数声明存在提升
• 函数表达式不会被提升
• 函数声明提升的优先权大于普通变量声明
• let, const由于存在暂时性死区，表现出的情况和var声明有所不同