• JS 变量的作用域



    变量的作用域,是指变量的作用范围。也就是说,变量只在特定范围有效,超出该范围无效。

    在JavaScript中,有两种变量,全局变量和局部变量:

    • 全局变量:可以在脚本中的任何位置被调用,全局变量的作用域是当前文档中整个脚本区域。
    • 局部变量:只能在此变量声明语句所属的函数内部使用,局部变量的作用域仅为该函数体。


    声明变量时,要根据编程的目的决定将变量声明为全局变量还是局部变量。一般而言,保存全局信息(如用户信息、菜单选项等)的变量需声明为全局变量,而保存临时信息(如待输出的格式字符串、数学运算中间变量等)的变量则声明为局部变量。

    举例说明变量作用域

    【例2-1】考察如下代码:

    1. <html>
    2. <head>
    3. <title>局部变量和全局变量</title>
    4. </head>
    5. <body>
    6. <script type="text/javascript">
    7. var total=100; //全局变量
    8. function add(num){
    9. var total; // 局部变量
    10. total=2*num;
    11. return total;
    12. }
    13. </script>
    14. <p onclick="alert(add(100));">显示局部变量</p>
    15. <p onclick="alert(total);">显示全局变量</p>
    16. </body>
    17. </html>

    保存并运行代码,点击第一段文本,显示 200;点击第二段文本,显示 100。

    分析:点击第一段文本,运行add()函数,对total变量赋值。这时,JavaScript会寻找total变量,如果在函数内部找到,就赋值;找不到,就到函数外部寻找。显然,在函数内部已经找到,赋值后它的值为200。这里的total变量就是局部变量。

    点击第二段文本,JavaScript会在全局内寻找total变量,如果找到,就返回它的值;找不到,将会引发错误。显然,已经找到,它的值是100。这里的total变量就是全局变量。

    可以发现,在add()函数内部对total变量赋值,并未影响外部的total变量。

    【例2-2】对【例2-1】稍作修改,去掉add()函数内部对total变量的声明。如下所示:

    1. <html>
    2. <head>
    3. <title>局部变量和全局变量</title>
    4. </head>
    5. <body>
    6. <script type="text/javascript">
    7. var total=100; //全局变量
    8. function add(num){
    9. total=2*num;
    10. return total;
    11. }
    12. </script>
    13. <p onclick="alert(add(100));">这已不是局部变量</p>
    14. <p onclick="alert(total);">显示全局变量</p>
    15. </body>
    16. </html>

    保存并运行代码,点击两段文本,都显示 200 。

    上述结果表明,JavaScript在add()函数内部没有找到total变量,又到函数外部寻找,找到后对它赋值,覆盖掉了原来的值。

    说明:JavaScript是从小范围到大范围寻找变量的。如果在当前范围内没有找到相应的变量,就会一级一级向上级范围去寻找,找到后,就对它进行操作,找不到将会引发错误。

    注意:任何情况下,JavaScript绝对不会从大范围向小范围寻找变量。如果在函数外部没有找到变量,绝对不会去函数内部寻找。

    在函数内部声明全局变量

    前面已经讲到,声明变量时要使用 var 关键字;但是,也可以不使用。

    无论在函数外部还是内部,不使用 var 关键字声明的变量都为全局变量

    这就给我们提供了两种声明全局变量的方法:

    • 在函数外部使用 var 关键字声明;
    • 在任何地方不使用 var 关键字声明。

    【例2-3】对【例2-2】稍作修改,去掉add()函数外部对total变量的声明。如下所示:

    1. <html>
    2. <head>
    3. <title>局部变量和全局变量</title>
    4. </head>
    5. <body>
    6. <script type="text/javascript">
    7. function add(num){
    8. total=2*num; // total 为全局变量
    9. return total;
    10. }
    11. </script>
    12. <p onclick="alert(add(100));">这已不是局部变量</p>
    13. <p onclick="alert(total);">显示全局变量</p>
    14. </body>
    15. </html>

    保存并运行代码,点击两段文本,都显示 200 。

    上述结果表明,在add()函数内部声明的total变量,已不再是局部变量,它在全局范围内都是有效的。

    注意:

    • 声明变量时请尽量使用 var 关键字,这对程序结构有很大的帮助。
    • 尽量不要在函数内部声明全局变量,也不要在函数内部和外部声明同名变量,这两种情况都会造成变量的混淆。

    只有在函数内使用 var 关键字声明的变量为局部变量

    这里需要强调的是,只有在函数内部使用 var 关键字声明的变量才是局部变量,在其它“语句块”内使用 var 关键字声明变量一般是全局变量,if...else...选择结构和for循环结构都是如此。

    【例2-4】在for循环内部声明变量。

    1. <html>
    2. <head>
    3. <title>在for循环内部声明变量</title>
    4. </head>
    5. <body>
    6. <script type="text/javascript">
    7. for(var i=0;i<=5;i++){
    8. var x=100;
    9. }
    10. </script>
    11. <p onclick="alert(i);">显示 i 变量的值</p>
    12. <p onclick="alert(x);">显示 x 变量的值</p>
    13. </body>
    14. </html>

    点击第一段文本,显示 6 ;点击第二段文本,显示 100 。

    上述结果表明,在for循环内部声明的 i 和 x 并不是局部变量,而是全局变量。

    总结:除了函数,JavaScript是没有块级作用域的。

  • 相关阅读:
    poj 1050
    poj 2479 Maximum sum
    Trie树结构(AC自动机前奏)(转)
    poj 3624(zeroonepack)
    poj 3630(Phone List )
    KMP算法(AC自动机前奏)(转)
    AC自动机(转)
    AC自动机模板(hdu2222)
    Running CMD.EXE as Local System
    什么是WPF(Avalon)
  • 原文地址:https://www.cnblogs.com/2260827114com/p/6428010.html
Copyright © 2020-2023  润新知