javascript变量提升

变量提升：它会将当前作用域的所有变量的声明提升到程序的顶部.

列子：console.log(a);

        var a=2;

js会将变量的声明提升到顶部，可是赋值语句并不会提升。

对于js来说，其实var a = 2是分为两步的:

var a;

a = 2;

而js只会将第一步提升到顶部，所以上面的语句等价于：

var a;

console.log(a);

a =2;

为什么有变量提升

那么为什么会出现变量提升这个现象呢？

js和其他语言一样，都要经历编译和执行阶段。而js在编译阶段的时候，会搜集所有的变量声明并且提前声明变量，而其他的语句都不会改变他们的顺序，因此，在编译阶段的时候，第一步就已经执行了，而第二步则是在执行阶段执行到该语句的时候才执行。

变量声明

js的变量声明其实大体上可以分为三种：var声明、let与const声明和函数声明。

函数声明与其他声明一起出现的时候，就可能会引起一些困扰。我们来看下面的例子。

foo();

functionfoo(){

console.log('foo');

}

varfoo =2;

你觉得上面会输出什么？TypeError吗？其实输出的结果是foo。这就引出了我们的问题了，当函数声明与其他声明一起出现的时候，是以谁为准呢？答案就是，函数声明高于一切，毕竟函数是js的第一公民。

那么，下面的例子呢？

foo();

functionfoo(){

console.log('1');

}

functionfoo(){

console.log('2');

}

当出现多个函数声明，那怎么办呢？以上代码输出结果为2。因为有多个函数声明的时候，是由最后面的函数声明来替代前面的。

想必经历了以上的例子，你应该已经对变量声明已经有一定的了解了。那么我再来出一道题目来测试下。

foo();

varfoo =function(){

console.log('foo');

}

这道题目是不是非常简单啊？这道题和上面的第二道例子其实是一样的。var foo = function() {}这种格式我们叫做函数表达式。

它其实也是分为两部分，一部分是var foo,而一部分是foo = function() {}，参照例2，我们可以知道，这道题的结果应该是报了TypeError(因为foo声明但未赋值，因此foo是undefined)。

上面我们提到了var声明，函数声明，那么接下来我们来讲讲let和const声明呢。这个我之前写过一边文章，大家可以点击这里去查看下。

总结

那么接下来我们来总结一下。

js会将变量的声明提升到js顶部执行，因此对于这种语句:var a = 2;其实上js会将其分为var a;和a = 2;两部分，并且将var a这一步提升到顶部执行。

变量提升的本质其实是由于js引擎在编译的时候，就将所有的变量声明了，因此在执行的时候，所有的变量都已经完成声明。

当有多个同名变量声明的时候，函数声明会覆盖其他的声明。如果有多个函数声明，则是由最后的一个函数声明覆盖之前所有的声明。