14 JavaScript js的编译

1 js运行的三个阶段

1. 语法分析
2. 预编译
3. 解释执行

语法分析就是JS引擎去检查你的代码是否有语法错误，解释执行就是执行你的代码。最重要最需要理解的就是第二个环节预编译，简单理解就是在内存中开辟一些空间，存放一-些变量与函数。

预编译可分为全局预编译和局部预编译。
1.在js脚本加载之后，会先通篇检查是否存在低级错误; .
2.在语法检测完之后，便进行全局预编译;
3.在全局预编译之后，就解释一行，执行一行;
4.当执行到函数调用那一行前一刻，会先进行函数预编译，再往下执行。

全局预编译的3个步骤:
1.创建GO对象(Global Object)全局对象，即window对象。
2.找变量声明，将变量名作为GO属性名，值为undefined
3.查找函数声明，作为GO属性，值赋予函数体

局部预编译的4个步骤:
1.创建A0对象(Activation Object)执行期上下文。
2.找形参和变量声明，将变量和形参名作为AO属性名，值为undefined
3.将实参值和形参统一赋值。
4.在函数体里面找函数声明，值赋予函数体。

案例：

var a = 10;
console.log(a);

function foo(a){
  console.log(a);
  var a = 100;
  console.log(a);
  function a(){};
  console.log(a);
  var b = function(){};
  console.log(b);
  function d(){};
}
var c = function(){
  console.log('匿名函数C');
};
console.log(c);
foo(20);

1、整个文件创建全局对象，GO/window
2、首先找到声明变量，分别为：a,c 初始并不赋值，默认值为undefined
3、在查找函数并声明，赋予函数体。
全局预编译-示例：
GO/window = {
  a: undefined,
  b: undefined,
  foo: function foo(a){
    console.log(a);
    var a = 100;
    console.log(a);
    function a(){};
    console.log(a);
    var b = function(){};
    console.log(b);
    function d(){};
  }
}
4、执行语句，变量被赋值；当执行到foo()时进行函数局部编译
解释执行-示例:
GO/window = {
  a:10,
  c:function(){
    console.log('匿名函数C')
  }
  function foo(a){
    console.log(a);
    var a = 100;
    console.log(a);
    function a(){};
    console.log(a);
    var b = function(){};
    console.log(b);
    function d(){};
  }
}
5、创建AO对象执行上下文
6、找到该函数的形参和变量声明，将变量和形参作为AO的属性名，值为:undefined  分别为：a,b
调用函数foo(20)钱发生的局部编译：
//局部预编译的5和6步操作如下:
AO = {
  a: undefined,
  b: undefined,
}
7、将实参和形参统一
//局部预编译的第三步操作如下：
AO = {
  a:20,
  b:undefined,
}
8、在函数体里面找函数声明，值赋予函数体。
//局部预编译的第四步操作如下：
AO = {
  a: function a() {},
  b: undefined,
  d: function d() {}
}
9、执行foo(20)