当局部变量和全局变量同名时，局部变量会覆盖全局变量

<script type="text/javascript"> //定义全局变量 var scope="全局变量"; function test() { document.writeIn(scope+"<br>"); //定义scope局部变量，作用范围为整个函数内 var scope ="局部变量"; //1 //再次输出scope的值 document.writeIn(scope+"<br>"); } test(); </script>

结果：

代码第一次输出的scope值并不是“全局变量”，而是undefined.这是什么原因呢？函数在1处定义scope局部变量，怎么在1处之前也不能访问全局的scope变量呢？

此处需要理解javaScript的变量提升机制。所谓变量提升，指的是变量声明总是会被解释器“提升”到函数体的顶部，这意味着上面程序中1处定义了scope局部变量，但解释器会提升该scope变量，将该变量的声明提升到函数体的顶部。

注意：变量提升只是提升变量声明部分，并不会提升变量赋值部分

因此，上面的test()函数实际上等同于

<script type="text/javascript"> //定义全局变量 var scope; document.writeln(scope + "<br>"); //定义scope局部变量，作用范围为整个函数内 scope ="局部变量"; //1 //再次输出scope的值 document.writeln(scope + "<br>"); </script>

不难看出，局部变量scope从函数开始就出现了，它覆盖了全局变量scope，但在1处之前，scope还没被赋值，因此第一行document处代码输出undefined.

javaScript变量提升甚至不需要定义变量的语句真正执行，只要在函数中包括了定义变量的语句，改变量声明就会被提升到函数体对的顶部

<script type="text/javascript"> var x=100; var y=200; function foo() { document.writeln(x + "<br>"); document.writeln(y); if(flase) { var x=1; } return;var y=2; } foo(); </script>

上面第一行var x=1;代码位于条件为false的if块内，第二行var y=2;代码位于ruturn之后，这两行粗体字代码根本不会获得执行对的机会，但javaScript解释器依然会提升这两个变量，因此该foo()函数其实等同于

<script type="text/javascript"> function foo() { var x, y; if (false) { x=1; } return; y=1; } </script>

这意味着从foo函数开始，全局变量x、y就会被局部变量x、y覆盖，在foo（）函数内无法访问全局变量x、y，在浏览器中浏览如下