JS的解析过程

1.预解析

2.逐行解读代码

<script>
   var name = 'xm';
   var age = 18;
   function fn(){
       var name = 'xh';
       var age = 10;
       console.log(name);
   }
   fn();   //name是xh
</script>

<script>
   var name = 'xm';
   var age = 18;
   function fn(argument){
       console.log(name);
       var name = 'xh';
       var age = 10;       
   }
   var name = 'xhei';
   fn();   //name输出的是undefine
</script>

         //预解析
        window：
            name = undefined
            age = undefined
            function fn(argument){
                   console.log(name);
                   var name = 'xh';
                   var age = 10;       
            }
         fn：
            name = undefined
            age = undefined

//如果是函数与变量冲突，预解析会解析函数，忽略变量

//如果是函数与函数冲突，预解析会解析后面的函数

<script>
   var name = 'xm';
   var age = 18;
   function name(argument){
       console.log(name);
       var name = 'xh';
       var age = 10;       
   }
   function name(argument){
       console.log(name);
       var name = 'xj';
       var age = 12;       
   }
</script>

//不推荐在if for里面定义函数，有的浏览器识别不到

1.js作用域问题一

<script>
   //没有var不能进行正常的预解析，预解析的时候就不知道有这个变量名
   console.log(a);  //undefined
   var a = 1;
   console.log(a);  //报错
   a = 1;
</script>

2.js作用域问题二

<script>
   console.log(a);  //a()
   var a = 1;
   console.log(a); //1
   function a(){
     console.log(2);
   }
   console.log(a);  //1
   var a = 3;
   console.log(a);  //3
   function a(){
     console.log(4);
   }
   console.log(a);  //3
   a();//3不能当函数执行，所以会报错
</script>

         预解析
         //a = undefined
         function a(){
          console.log(4);
         }//与变量重名解析为函数

3.js作用域问题三

   <script>
       console.log(a);  //会报错，与下面的script分开解析
   </script>
   <script>
       var a = 1;
   </script>

   <script>
       var a = 1; 
   </script>
   <script>   
       console.log(a); //a=1
   </script>

4.js作用域问题四

<script>
         var a = 1;
         function fn() {
            console.log(a);//undefined
            var a = 2;
         }
         fn();
         console.log(a);//1
</script>

<script>
         var a = 1;
         function fn(){
            console.log(a);//1
            a = 2;
         }
         fn();
         console.log(a);//2
</script>

<script>
         var a = 1;
         function fn(a){ //参数相当于局部变量
            console.log(a);//undefined
            a = 2; //修改的是局部变量
         }
         fn();
         console.log(a);//1 
</script>

<script>
         var a = 1;
         function fn(a){ 
            console.log(a);
            a = 2; 
         }
         fn(a);//1 将参数传递进来
         console.log(a);//1
</script>