Hoisting（变量提升）

var 和 let 的区别是什么？

答案之一就有 let 不会变量提升

那么，什么是变量提升？

变量提升（Hoisting）被认为是， Javascript中执行上下文 （特别是创建和执行阶段）工作方式的一种认识。 --MDN

基本概念

console.log(a);  // 输出 undefined
var a = 1;

这里使用var声明一个变量a，我们却能在声明之前使用，这里究竟发生了什么？
原来，使用var声明一个变量的时候，不管你在哪里声明，执行程序的时候都会先将这个声明移动到作用域的最前面，而赋值操作则留在原处。
以上代码可以看做

var a;
console.log(a);  // 输出 undefined
a = 1;

变量提升能否跨作用域

foo()
console.log(a)
function foo() {
      var a = a
      console.log('foo')
}

执行结果

a is not defined说明变量提升存在作用域
这里发生了一个有趣的现象，我们在声明函数foo前调用了它，可以看出已经正常执行
所以我们意外地得到一个结论，使用function声明函数存在整体的提升
上面的代码等同于

function foo() {
      var a = a
      console.log('foo')
}
foo()
console.log(a)

变量提升能否跨script标签

<script>
console.log(a);
</script>
<script>
var a = 1;
</script>

执行结果

结论 变量提升不能跨script

var和function都存在提升，那么这个提升是否存在优先级

console.log(a)
var a = 1
function a () {}
console.log(a)

执行结果

函数整体提升了，然后给a重新赋值为1，所以先输出了函数

console.log(a)
function a () {}
var a = 1
console.log(a)

执行结果

没有发生变化，我得到的结论是function会整体提升，var只是声明一个变量，如果变量已存在则不会再次声明

var声明函数变量不存在整体提升

使用var声明只存在变量提升

console.log(a)
a()
var a = funciton () {}

执行结果

变量提升只会声明一个值为undefined的变量