zoukankan      html  css  js  c++  java
  • 变量作用域

    1.练习 

    复制代码
    复制代码
    1 alert(a)
    2 var a = 10;
    3 alert(a);
    4 a();
    5 function a(){
    6    alert(2);      
    7 }
    复制代码
    复制代码

      1.1 以上代码JS是如何解析的呢?

      首先,我们要明白Javascript的解析过程有定义阶段和执行阶段,那么我就用我理解的来做这些练习题

      分析:

        (1) 定义 (var和函数声明)

          var a ;

            function a() {alert(2);}

          在定义阶段就只有这两个,而因为它们的名字相同,所以var a会被忽略,那么就只剩下

          function a() {alert(2);},于是在定义阶段只剩下函数声明

        (2) 执行

          来到执行阶段,OK,那就一步步往下执行好了

          alert(a)    // 定义阶段有function a() {alert(2)},于是会弹出这个函数体

          a = 10;   // 这一步是赋值,上一步相当于 var a = function() {alert(2);},这一步改变了a的值

          alert(a)   // 10

          a();  // 这里会报错,a is not function,因为此时a已经赋值为10,那么10()是什么呢?所以会报错

      1.2 于是乎,以上这道题的答案就是,首先弹出function a() {alert(2);} ,然后再弹出10.

    2.练习

    复制代码
    复制代码
     1 alert(a);
     2 var a=10;
     3 
     4 alert(a);
     5 function a(){
     6     alert(20);
     7 }
     8 
     9 alert(a);
    10 var a=30;
    11 
    12 alert(a);
    13 
    14 function a(){alert(40);}
    15 alert(a);
    复制代码
    复制代码

      2.1 上面这道题看上去是不是也会很晕呢?那么JS到底是怎样解析的呢?其实通过上面的分析,很快就会得出答案

      分析:(由于上面已经分析得很详细,那么下面的分析思路就省略了)

        (1) 定义 (var和函数声明)

          var a;

          function a(){alert(20);}

          var a;

          function a(){alert(40);}

          最后剩下function a(){alert(40);} 

        2.执行

          第1条语句  alert(a)  //function a(){alert(40);}

          第2条语句  a = 10   //给a赋值

          第3条语句  alert(a)  //10

          第4条语句是函数声明,是在定义阶段,不是执行阶段

          第5条语句  alert(a)  //10

          第6条语句  a = 30;  //赋值

          第7条语句 alert(a)  //30

          第8条语句同第4条语句都是函数定义

          第9条语句  alert(a)  //30

      2.2于是乎,上面的执行结果为function a(){alert(40);},10,10,30,30

    3.练习

    复制代码
    复制代码
    1 a();
    2 var a = function(){alert(1);}
    3 a();
    4 function a(){alert(2);}
    5 a();
    6 var a = function b(){alert(3);}
    7 a();
    复制代码
    复制代码

      3.1分析JS的解析过程

        1.定义

           function a(){alert(2);}

        2.执行

          a();  //2;

          a = function(){alert(1)};  //赋值

          a();  //1

          a() // 1;

          a = function b(){alert(3)} //赋值

          a() //3

        3.2 以上执行结果为2,1,1,3

    4 练习

    复制代码
    复制代码
    1 var a = 0;
    2 function fn(){
    3     alert(a);
    4     var a = 1;
    5     alert(a);
    6 }
    7 fn();
    复制代码
    复制代码

      4.1分析

        (1) 定义

          var a;

          function fn(){alert(a);var a=1;alert(a);}

        (2) 执行

          fn() //fn()作用域

              (1) 定义

                var a;

              (2) 执行

                alert(a)  //undefined

                a = 1;  //赋值

                alert(a)  //1

      4.2 这里就会有全局作用域和局部作用域的考察,在fn()作用域中,当函数执行完成,变量会销毁.结果为undefined,1

    5.练习,如果我们将第四道题稍微改定一下,讲fn()函数里声明的变量a,var去掉那会怎样呢?

    复制代码
    复制代码
    1 var a = 0;
    2 function fn(){
    3     alert(a);
    4     a = 1;
    5     alert(a);
    6 }
    7 fn();
    复制代码
    复制代码

      5.1 分析

        (1) 定义

          var a;

          function fn(){alert(a);a=1;alert(a)}

        (2) 执行

          fn() // fn()作用域

              (1) 定义

                 在此作用域未定义

              (2) 执行

                alert(a)   //会往上级作用域查找a,于是弹出0

                a = 1 //赋值

                alert(a)  //1

      5.2 结果为0,1

    6.练习

    复制代码
    复制代码
    1 fn();
    2 alert(a);
    3 var a = 0;
    4 alert(a);
    5 function fn(){
    6     var a = 1;
    7 }
    复制代码
    复制代码

      6.1 分析

        (1) 定义

          var a;

          function fn(){var a=1;}

        (2) 执行

          fn() // 什么也不做

          alert(a)  //undefined

          a = 0;  //赋值

          alert(a)  //0

      6.2 结果弹出undefined,0

    7.练习

    复制代码
    复制代码
     1 fn();
     2 var a = 0;
     3 function fn() {
     4    alert(a);
     5    var a = 3;
     6    function c() {
     7        alert(a);
     8     }
     9     return c;
    10 }
    复制代码
    复制代码

      7.1 分析

        (1) 定义

          var a;

          function fn(){alert(a);var a=3;function c(){alert(a)};return c;}

        (2) 执行

          fn() //fn()作用域

              (1) 定义

                var a;

                function c(){alert(a);}

              (2) 执行

                alert(a)  //undefined

                a = 3;  //赋值

      7.2执行结果:弹出undefined

    8.练习

    复制代码
    复制代码
    1 var a = 1;
    2 function fn(a){
    3     alert(a);
    4     a++;
    5     alert(a);
    6 }
    7 fn(a);
    8 alert(a);
    复制代码
    复制代码

      8.1 分析

        (1) 定义

          var a;

          function fn(a){alert(a);a++;alert(a)} 

        (2) 执行

          a = 1; //赋值

          fn(a)  //fn()作用域

              (1)  定义

                var a;   //参数

              (2)  执行

                a = 1; //赋值

                alert(a)  // 1

                a++ ;  //2

                alert(a)   //2

          alert(a)   //1

      8.2 结果为弹出1,2,1

    9.练习,对练习8的稍作改动,如果这时候fn函数定义的时候没有参数会怎样呢?请看下面的分析

    复制代码
    复制代码
    1 var a = 1;
    2 function fn(){
    3     alert(a);
    4     a++;
    5     alert(a);
    6 }
    7 fn(a);
    8 alert(a);
    复制代码
    复制代码

      9.1 分析

        (1) 定义

          var a;

          function fn(){alert(a);a++;alert(a);}

        (2) 执行

          a = 1;  //赋值

           fn(a)  //fn()作用域

              (1) 定义

              (2) 执行

                alert(a)   //因为fn()作用域没有定义变量a,所以会向上查找 ,结果找到了a = 1,于是弹出1

                a++  //2

                alert(a)  //2

         alert(a)   //此时的a是多少呢?可以看到fn()里弹出的a是全部作用域,而这里即将弹出的a也是全局作用域,所以应该弹出2,而不是1

      9.2执行结果为:1,2,2

  • 相关阅读:
    POJ 题目2750 Potted Flower(线段树求环型区间中连续区间的最大和)
    即使没人看我们也要坚持写Blog
    鸟哥的Linux私房菜-----7、硬件管理
    android createbitmap函数内存溢出,求解怎样进行处理out of memory溢出问题
    hdu4614Vases and Flowers 线段树
    安装npm及cnpm(Windows)
    安装npm及cnpm(Windows)
    安装npm及cnpm(Windows)
    Echarts设置点击事件
    Vs Code中炫酷写代码插件Power Mode的安装配置
  • 原文地址:https://www.cnblogs.com/yzadd/p/6437116.html
Copyright © 2011-2022 走看看