<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>局部變量作用域</title>
    <script>
        // 定義函數fn
        function fn(){
            var a=5;// 定義局部變量
            document.write(a);
        };
        // 調用函數fn
        fn();
        // 定義函數fn2
        function fn2(){
            document(a);
        };
        // 調用函數fn2
        fn2();
    </script>
</head>
<body>
    
</body>
</html>

結果：

2、全局變量

全局變量：定義在函數外部的變量稱為全局變量，其作用域是整個JavaScript代碼塊?？聪旅娴睦樱?/p>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>全局變量作用域</title>
    <script>
       var number; // 全局變量
       function fn(){
          number=5;
          document.write("number的值是:"+number+"<br />");
       };
       function fn2(){
           ++number;
           document.write("number的值是:"+number+"<br />");
       }
       fn();
       fn2();
    </script>
</head>
<body>
    
</body>
</html>

結果：

注意：

a、如果在函數內定義了和全局變量相同名稱的局部變量，那么在函數內部使用就近原則：即在函數內部局部變量起作用。

看下面的例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>全局變量作用域</title>
    <script>
       var number; // 全局變量
       /*       function fn(){
          number=5;
          document.write("number的值是:"+number+"<br />");
       };
       function fn2(){
           ++number;
           document.write("number的值是:"+number+"<br />");
       } */

       // 就近原則
       function fn(){
          var number="我是局部變量";
          document.write("number的值是:"+number+"<br />");
       };
       function fn2(){
           number="我是全局變量"
           document.write("number的值是:"+number+"<br />");
       }
       fn();
       fn2();
    </script>
</head>
<body>
    
</body>
</html>

結果：

b、全局變量window

如果在定義變量的時候沒有使用var，那么默認是全局變量，無論是在函數外部還是在函數內部定義變量。看下面的例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>全局變量作用域</title>
    <script>
       var number; // 全局變量
       /*       function fn(){
          number=5;
          document.write("number的值是:"+number+"<br />");
       };
       function fn2(){
           ++number;
           document.write("number的值是:"+number+"<br />");
       } */

       // 就近原則
 /*       function fn(){
          var number="我是局部變量";
          document.write("number的值是:"+number+"<br />");
       };
       function fn2(){
           number="我是全局變量"
           document.write("number的值是:"+number+"<br />");
       }
       fn();
       fn2(); */

       // windows
       // 相當于window.a
       a=12;
       function fn(){
           // 相當于window.b
           b="我是window對象,是全局變量";
       };
       fn();
       document.write("a="+a+"<br />");
       document.write("b="+b+"<br />");
    </script>
</head>
<body>
    
</body>
</html>

結果：