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:

1 2 3 4 5 6 7 8 9 10 11 12 13

<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:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

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:

1 2 3 4 5 6 7 8 9 10 11 12 13

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:

1 2 3 4 5 6 7 8 9 10 11 12 13

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:

1 2 3 4 5 6 7 8 9 10 11 12 13

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（）{。。。},再执行函数内部。。。