javaScript变量提升与词法解释

到底什么是变量提升，我们先来看两段javascript代码

a='test';
var a;
console.log(a);

console.log(a);
var a='test';

那么这两段代码在控制台输出的是什么呢，它的输出结果分别是test和undefined。

这是为什么呢，那是因为javascript并不是一行一行的执行的。要运行javascript，要经历两个阶段

1.词法解释（预编译）

在这个阶段，会在整个文件之中查找带var的关键字，并把带var关键字的变量声明提到当前作用域的最前面，而赋值语句停留在当前位置。

2.运行阶段（代码从上往下执行）

所以按照此规律我们再去看看这两段代码，是不是就能够理解为什么第一段代码输出test而第二段代码输出的是undefined了。

变量声明会提前，那么函数呢。让我们来看下面两段代码

test();
function test()
{
	alert('test');
}

vtest();
var vtest=function test()
{
 alert('test');
}

我们可以看到，第一段是一个正常的函数声明，第二段是一个匿名函数，函数调用都在函数声明之前，然后我们来分别执行它们，最后得到的结果是第一段能弹出test窗口，第二段会爆 SCRIPT5007: Object expected的错误，这又是为什么呢。

正常声明的函数和var一样，也会在编译的时候向上提升到作用域的最前面，所以第一段代码能正常弹出警示框，而匿名函数则不可以，按照前面var的变量提升原则，它会变成这个样子

var vtest；
vtest();
vtest=function test()
{
 alert('test');
}

按这个样子来的话当然会报错： SCRIPT5007: Object expected。

最后我们来看一段变量提升的练习。

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

这段代码最后会被解释成这样：

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

最后运行结果：