js作用域的理解


script:自上而下 全局变量、全局函数

函数:由里到外

浏览器:

   “JS解析器”

    1)“找一些东西”: var function

      参数 a = undefine 所有的变量,在正式运行代码之前,都提前赋了一个值:未定义

      fn1 = function fn1(){ alert(2); } 所有的函数,在正式运行代码之前,都是整个函数块

      JS 的预解析原则: 遇到重名的:只留一个!变量和函数重名了,就只留下函数

    2)逐行解读代码:表达式(= + - * / % ++ -- ! )可以修改预解析的值! 注意:函数块不要放在if/else、for的{}里面执行;函数如果带参数,预编译 先找 参数的声明 并且把 实参赋值给形参,再执行找函数的操作

代码解析至少分两步

1)预解析:查找var,function参数例如下面这个例子

a= 未定义

fn1={alert(2)}函数的话,是整个整体

2):逐行读代码:类似=+-%*等都是表达式,表达式可以改变值

example1:

<script>

 alert(a)   //最终结果:undefiner

var a=1

function fn1(){

alert(alert(2));

} 

</script>

分析:

  预解析: a=未定义;fn1=function fn1(){alert(alert(2));}

  执行:

    alert(a) ==》未定义

    var a=1

    function fn1(){

      alert(alert(2));

    }

example2:

alert(a)         //4

var a=1  

alert(a)       //1

function a(){alert(2)}

alert(a)      //1

var a=3;

alert(a)     //3

function a(){alert(4)}

alert(a)   //3

分析:

  预解析: a=未定义;a=function a(){alert(2)} a=未定义;a=function a(){alert(4)}(查找var function 参数,,重名时只会留下有值的,这里第一个是undefine,所以踢掉,若都有值,那么谁后执行就留下谁)

  执行:  

    alert(a) ==>function a(){alert(4)}

    var a=1   ==>a=1

    alert(a) ==>1

    function a(){alert(2)} ==>没有表达式,不改变值

    alert(a) ==》1

    var a=3; ==》3

    alert(a) ==》3

    function a(){alert(4)}==>没有表达式,不改变值

    alert(a) ==》3

example3:

var a=1;

function fn1(){

alert(a);

var a=2

}

fn1();//undefine

alert(a)//a=1

预解析:

  1):查找var function 参数

    a=未定义

    fn1=function fn1(){

    alert(a);

    var a=2

  }

执行:

  var a=1;==》a=1

  function fn1(){`==》不改变值

  alert(a);

  var a=2

  }

  fn1();==》

    开始预编译: a=1,a=未定义;,

    开始执行:

      alert(a)==》未定义

       a=2        

  alert(a) ==>a=1,因为这是函数里面的变量,不能作用到函数外;

example4:

var a=1;

function fn1(){

alert(a);//1

a=2

}

fn1()

alert(a)//2

预解析:

  a=undefine

  fn1=function fn1(){

  alert(a)

  a=2}

执行:

  var a=1;==》1️⃣a=1

  function fn1(){ 3️⃣预解析:无var,无function,所以没有了

    alert(a); 4️⃣执行 a=1

    a=2 5️⃣执行a=2

    }

    fn1() 2️⃣

    alert(a) 6️⃣a=2

example5:

var a=1

function fn1(a){

alert(a);

a=2;

}

fn1(a);//1

alert(a);//1

预解析: a=未定义 fn1=function fn1(a){....}

执行:  

  var a=1 ==》a=1

  function fn1(a){ 预解析: 1.a=未定义(原因是有参数,这里相当于 var a=1) 2.赋值实参 a=1, 3.a=2

    alert(a);  ==>a=1

    a=2; ==>a=2(函数内部的a=2);//内部有的值,不改变外部a变量的值;

  }

    fn1(a);//1

    alert(a);//1

注意:如果fn1函数中带有其他函数fn1x(){} 并且执行该函数的,那么过程就是预解析: a=未定义 a = 1,然后再是 fn1x = fn1x(){。。。},再执行函数内部。。。

优质内容筛选与推荐>>
1、JavaScript学习笔记(一)—细节问题
2、docker学习(1) 安装
3、【原创】头文件、宏定义、条件编译、避免头文件重复包含
4、Socket、Http、TCP/IP、UDP的联系与区别
5、Android Studio 使用小结


长按二维码向我转账

受苹果公司新规定影响,微信 iOS 版的赞赏功能被关闭,可通过二维码转账支持公众号。

    阅读
    好看
    已推荐到看一看
    你的朋友可以在“发现”-“看一看”看到你认为好看的文章。
    已取消,“好看”想法已同步删除
    已推荐到看一看 和朋友分享想法
    最多200字,当前共 发送

    已发送

    朋友将在看一看看到

    确定
    分享你的想法...
    取消

    分享想法到看一看

    确定
    最多200字,当前共

    发送中

    网络异常,请稍后重试

    微信扫一扫
    关注该公众号





    联系我们

    欢迎来到TinyMind。

    关于TinyMind的内容或商务合作、网站建议,举报不良信息等均可联系我们。

    TinyMind客服邮箱:support@tinymind.net.cn