JavaScript[16] -- 解析顺序

编译

• 先去查找第一个做用域里面全部的声明,var,function,声明不赋值，赋值在执行期

• 代码进行静态分析,找声明变量,函数,检测语法是否符合规范

  <script>
  
      // 1.function权重比var高
      // 在var和function声明同一个变量的时候函数会覆盖var
      alert(a);       // 结果为 function a(){}
      var a = 0;
      function a(){};
  
      // 2.静态检测语法是否符合规范
      function b(){
          return x + y = 1;   // 执行前 = 号报错
      };
  
  </script>

执行期

• 运行js代码,执行期里面有新的做用域,新的做用域就会被激活,重新开始编译-执行,依次类推

  <script>
  
     console.log(a);    // undefined
      fun();             // undefined
      var a = 10;
      function fun(){
          console.log(a);
      }
      console.log(a);    // 10
  
      var x = 5;
  
      func();
  
      function func(){
          console.log(x);         // undefined
          var x = 10;
          console.log(x);         // 10
          console.log(this.x)     //  5
      }
  
      console.log(x);             // 5
  
      /*
         1.编译
             x
             function func(){}
         2.执行期
             func()自执行,产生新的做用域
                     1.编译:
                         var x;
                     2.执行期
                         x => undefined  (本做用域里的x，还未被赋值)
                         x => 10;        (本做用域里的x，已经被赋值)
                         this.x => 5     (自启动函数，this指向window)
             返回上一个做用域继续执行--
             console.log(x);     (本做用域里的x，被赋值)
             x = > 5
             最后一行直接报错,不能访问内部变量
      */
     
      function m(){
          var n = 1;
          console.log(n);
      }
      function m(){
          var n = 2;
          console.log(n);
      }
  
      m();            // 2 第二个m()覆盖第一个m()
      var m = 3;      // 变量m覆盖函数m
      console.log(m); // 3
      m();            // m is not a function   此时m是个变量，不是函数
  </script>