彻底搞清JavaScript的变量作用域

资料来源于网络：

    变量的作用范围又称为作用域，是指某变量在程序中的有效范围。根据作用域，变量可以分为全局变量和局部变量。
1  全局变量的作用域是全局性的，即在整个JavaScript程序中，全局变量处处使用。
2  而在函数内部声明的变量，只在函数内部起作用。这些变量是局部变量，作用域是局部性的；函数的参数也是局部性的，只在函数内部起作用。
    在函数内部，局部变量的优先级比同名的全局变量优先级要高；如果存在与全局变量名称相同的局部变量，或者在函数内部声明了与全局变量同名的参数，那么，该全局变量将不再起作用。

如例1：

<script language="javascript" type="text/javascript">
<!--
 var a = "我是一个全局变量";
 function check()
 {
      var a = "我是一个局部变量";
      document.write(a);
 }
 check();
//-->
</script>

 输出：我是一个局部变量

 

    虽然在全局作用域中可以不使用var声明变量(没有声明的变量会被编译成全局变量)，但在作为局部变量时，一定要使用var语句声明变量。一般情况下，函数并不知道全局作用域中定义了什么变量，也不知道这些变量的作用。如果函数使用的是全局变量，而不是局部变量，那么它将改变全局变量的值。因此，最好在声明所有变量时都使用var语句。
       JavaScript没有块级作用域，函数中声明的所有变量无论是在哪里声明的，在整个函数中都有意义。在下面代码中，变量i,j,k作用域相同，在整个函数体中都有意义。

看例2：

<script language="javascript" type="text/javascript">
<!--
 function check()
 {
         var i = 0;
         if(i == 0)
         {
                var j = 1;
                for(var k = 0;k < 1;k ++)
               {
                      document.write("k在循环体内的值为：" + k + "<br />");
               }
               document.write("k在循环体内的值为：" + k + "<br />");
         }
        document.write("j在if语句外的值为：" + j);
 }
 check();
//-->
</script>

输出：

k在循环体内的值为：0
k在循环体内的值为：1
j在if语句外的值为：1

 

思考：

一直我的困惑问题，如例1：

1.声明了全局变量后，在函数怎么使用全局变量

2.函数怎么识别他是不是全局变量

    之所以产生以上两个疑问，因为看过很多资料之后，越看越糊涂。后来看了这篇资料后，才顿悟!其实道理很简单，在使用同名局部变量后，同名全局变量就被覆盖。不知道是我理解不够，还是有些文章语句生硬，或者是根本没有表述清楚，强烈建议技术书籍尽量使用短句，平实的语句。

 

自解疑惑：

例2：

<script language="javascript" type="text/javascript">
<!--
 var a = "我是一个全局变量";
 function check()
 {     
     alert(a);
//a += "我是一个局部变量";
     // document.write(a);
 }
 check();
//-->
</script>

输出：我是一个全局变量

 

例3：

<script language="javascript" type="text/javascript">
<!--
 var a =4
 function check()
 {
     alert(a);
     var a=5;
 }
 check();
//-->
</script>

输出：undefined

分析：这里的undefined其实相当于null,因为 var a=5;作用在整个函数体内，全局变量不起作用，此时属于没有声明就使用了变量。

 

例4: 

<script language="javascript" type="text/javascript">
<!--
 a =4
 function check()
 {
     alert(a);
  }
 check();
//-->
</script>

输出：   4

分析：对于从未声明过的对象，如果尝试给它赋值，会隐式的将它声明为全局对象

例5: 

<script language="javascript" type="text/javascript">
<!--
 function check()
 {
     alert(a);
  }
 check();
//-->
</script> 

 结果:不会弹出对话框，会报错

结果分析：

在IE里，如果尝试读一个未声明的对象，会报错,有时候在一些复杂的程序里面，会报错，但是不能保持报错的状态，当然也不会继续执行JS。这点其实挺要命，不执行也不告诉你错在哪儿。

因此,写法如下是经常容易犯错误：

if(!a) {
//do sth. ...
}

这样写有时候的初衷是：如果变量a不存在，就执行里面的语句。但如果a未定义，在Firefox中会报错；在IE里不会报错，但也不会执行以后的所有语句。

 

所以该如何探测一个变量是否被定义呢？一个巧妙的办法是：

if(!window.a) {
//do sth. ...
}

这个方法其实很奇妙，因为读一个未声明的变量，会报错；但读一个未声明的属性，就不会报错。天晓得JS为啥规定这样奇怪的语法。

但是这样的方法只适用与全局变量。若是某个函数里的局部变量，还是用typeof去判断吧：

if(typeof a == 'undefined') {
//do sth. ...
}

例5：

  <script language="javascript" type="text/javascript">
<!--
 function b()
{
    alert(i);
    //i=3;
}

function a()
{
    var i = 4;
    b();
    alert("i="+i);
}
a();
//-->
</script>

 

输出结果为：undefined

i作为局部变量,它只在函数a内起作用，尽管函数b()也在函数a()内，但在函数b()内不起作用。

 

最后终结：

              不要在变量未定义之前使用它

              不要在条件语句中声明变量