对js中局部变量、全局变量的理解与案例

438 阅读3分钟

全局变量

在js中,这样定义全局变量, 在函数外声明的变量是全局变量,网页上的所有脚本和函数都能访问它。 全局变量会在页面关闭后被删除

案例:

` // 全局变量 可以在局部使用

var str='夜宵想吃啥?';

function fn1( ){

  // 函数内部,使用全局变量
  
  console.log(str)

}

fn1(); 不在任何函数内定义的变量就具有全局作用域。全局变量在任何地方都能调用。`

局部变量

对于局部变量,定义是:在 JavaScript函数内部声明的变量(使用 var)是局部变量,所以只能在函数内部访问它。(该变量的作用域是局部的)。可以在不同的函数中使用名称相同的局部变量,因为只有声明过该变量的函数才能识别出该变量。只要函数运行完毕,本地变量就会被删除。所有函数的形参都是局部变量,所有的全局变量都是win的属性,所有的函数都是win的方法。

以下情况为局部变量:
1.形参
2.在函数内部直接用var声明的变量

案例1:

` function fn(){

    var a = 1;
}

console.log(a);    //报错:a is not defined

在函数内部定义的变量,该变量的作用域是整个函数体,在函数体外不可引用该变量,这是局部作用域`

案例 2:

` var num = 1

    function demo() {
        console.log(num);//第9行声明提升,但是赋值无法提升,所以是undefined
        function demoSon() {
            console.log(num);//输出的是第9行的
            num = 3;//修改的是所有的sum的值,包括第1行和第9行的
            console.log(num);//输出的是第行的
        }
        var num = 2
        demoSon();
    }
    demo();
    /*
    输出结果:undefined 2 3
    第一个num输出undefined是因为function内部定义了一个num,num进行了声明提升,所以不会使用外面的全局变量‘
    又因为赋值不会提升,所以输出结果是undefined;
    第二个num输出结果是2,是因为它本函数内部没有声明num,所以它需要去上一级找声明的num,上一级的num的值为2,
    所以输出结果为2
    第三个num输出结果是3,是因为它本函数内部没有声明num,所以它需要去上一级找声明的num,此时上一级的num的值
    被重新赋值为3,所以输出结果为3.
    */`

案例3:声明隐式全局变量(不推荐)

​
   function fn1(){
       str='夜宵想吃啥?';
   }
   console.log(str)
  fn1();

变量生命周期

1.永远存在----全局变量 程序没关,一直占用内存,少用全局

2.朝生暮死----局部变量 函数的大括号开头到函数的大括号结尾,可以少占用内存

<script>
    var num1 = 1; // 创建一个全局变量
        num2 = 2;     // 相当于 var num2 = 2;   没加var是隐式全局变量
    
    // 创建一个函数/方法
    function test1()
    {
        var num3 = 3;      // 创建一个局部变量
        num4 = 4;          // 没加var是隐式全局变量
        
        console.log(num1); // 输出全部变量num1 
        console.log(num2); // 输出隐式全局变量num2 
        console.log(num3); // 输出局部变量num3 
        console.log(num4); // 输出隐式全局变量num4
    }
    
    // 调用自定义函数
    test1();
    
​
    console.log(num1 + '-');// 输出全部变量num1 
    console.log(num2 + '-'); // 输出隐式变量num1 
    // console.log(num3);       // 在函数体外部输出局部变量 
    console.log(num4 + '-'); // 输出函数体内局部变量
    
    </script>

最后再来说一下变量的三个规则

在作用域内一共提供了三个规则 规则在所有作用域内通用

变量定义规则:

+ 定义在哪一个作用域下的变量
+ 就是哪一个作用域的私有变量
+ 只能在该作用域及其后代作用域内使用
+ 不能再父级作用域内使用

变量访问规则:

+ 当你需要访问一个变量的值的时候
+ 首先在自己作用域内查找, 如果有, 直接使用, 停止查找
+ 如果没有, 去到父级作用域查找, 如果有直接使用, 停止查找
+ 如果还没有, 在去到父级作用域
+ 直到 全局作用域(window) 都没有
+ **那么直接报错 xxx is not defined**

变量赋值规则:

+ 当你需要给一个变量进行赋值操作的时候
+ 首先在自己作用域内查找, 如果有, 直接赋值, 停止查找
+ 如果没有, 去到父级作用域查找, 如果有直接赋值, 停止查找
+ 如果还没有, 就再去父级作用域查找
+ 以此类推, 直到全局作用域(window) 都没有
+ **那么把这个变量定义为全局变量, 再进行赋值**

以上就是我的分享啦,欢迎各位小伙伴补充或者提意见啦!!!