JS全局变量和局部变量

本文总结了JavaScript中全局变量和局部变量的区别与交互,包括局部变量覆盖全局变量、作用域由函数定义、变量提升的规则以及未赋值声明不会导致错误。通过示例解释了变量提升现象,并探讨了使用var声明与未声明变量的不同效果。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

最近在学习JS时,发现对JS的全局变量和局部变量理解不够深入,特此做一下总结:
一 当局部变量和全局变量重名时,局部变量会覆盖全局变量.当离开局部变量的scope后,又重回到全局变量的scope,而当全局变量遇上局部变量时,怎样使用全局变量呢?用window.globalVariableName。
二 JS变量的scope是根据方法块来划分的(也就是说以function的一对大括号{ }来划分)是function块,而for、while、if块并不是作用域的划分标准,
三 JS在执行前会对整个脚本文件的声明部分做完整分析(包括局部变量),从而确定实变量的作用域(变量提升),JS引擎的工作方式是,先获取所有被声明的变量再逐一执行,所有变量的声明语句都会被提升到当前代码块的头部,变量提升只会提升变量的声明,变量赋值不会提升.
下面举例说明:

<script type="text/javascript">
            function test1(){
                var a=2;
                alert(a);
            }
            test1();//2局部变量
            alert(a);//1全局变量
</script>

上面的例子很好理解,在test1()中局部变量a把全局变量a覆盖了,当执行完test1()后,又重回到全局变量的范围.

<script type="text/javascript">
            var a=1;
            function test2(){
                alert(a);
                var a=2;
                alert(a);
            }
            test2();//undefined 2
            alert(a);//1
</script>

为什么上面的例子结果是这样的呢?因为JS在执行前会对整个脚本文件的声明部分做完整分析(包括局部变量),所以在执行test1()之前,局部变量a已经声明过了,在第五行声明的,注意虽然第五行同时也把2赋值给局部变量了,但是正如上面总结的那样,只是声明提前了,赋值并没有提前,所以a此时还是没有值,所以输出undefined,(注意这是声明了,没有赋值而已,所以程序不会出错,假如也没有声明,则程序会出现错误),第六行输出局部变量2,,第九行输出全局变量1.上面的程序等价于

<script type="text/javascript">
function test2() {  
      var a;//局部变量与全局变量重名时会覆盖全局变量,此时的a只有声明却未定义  
      alert(a);//所以执行alert值为undefined  
      a = 2;  
      alert(a);  
}  
  test2();  
  alert(a);
</script>

在看一个变量提升的例子

<script type="text/javascript">
var a=1;
function test3(){
    alert(a);
    a=2;
    alert(a);
    var a;
    alert(a)
}
test3();//undefined 2 2
alert(a);//1
        </script>

刚才我们说了JS变量的scope是根据方法块来划分的(也就是说以function的一对大括号{ }来划分)是function块,而for、while、if块并不是作用域的划分标准,举个例子

<script type="text/javascript">
            function test5(){
                alert(i);//undefined
                for(var i=0;i<3;i++){
                    alert(i);//0 1 2
                }
                alert(i);//3,注意,此时已经在for scope以外,但i的值仍然保留为3
                if(true){
                    var j=0;
                    alert(j);//0
                }
                alert(j);//0,此时已经在if scope以外,但是j的值仍然保留为0
            }
            test5();
            alert(i);//error,原因是变量i未声明,导致脚本错误,程序到此结束!  
            alert(j);//未执行
        </script>

下面还有个好玩的现象

    <script type="text/javascript">
            function test6(){
                a=100;
            }
            test6();
            alert(a);//100,在函数作用域内 加var定义的变量是局部变量,不加var定义的就成了全局变量
        </script>
<script type="text/javascript">
var a=100;
function test7(){
    a=200;
    alert(a);//200
}
test7();
alert(a);//200
</script>
<script type="text/javascript">
function test8(){
    alert(a);
    var a="hello world";
}
test8();//undefined
alert("执行了......");//这句话执行了
</script>
<script type="text/javascript">
function test9(){
    alert(a);
    a="hello world";
}
test9();//出错
alert("未执行......");//这句话未执行
</script>

原因是使用var 定义变量会提升变量声明,不适用var则不可以

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值