日志►第一天

js执行过程

在介绍js执行过程之前先了解两个概念

编译语言：一种以编译器来实现的编程语言，由编译器，先将代码编译为机器码，再加以运行（如C语言）。

直译语言：这种编程语言需要利用解释器，在运行期，动态将代码逐句直译为机器码，或是已经预先编译为机器码的的子程序，之后
再运行（如js）。

具体解释自行百度。

按照直译型语言的解释猜测一下下面的代码的输出情况

1
var x = 10;
function foo(){
    console.log(x); //如果代码一行一行的直译执行的话 x = 10， 而结果为undefined。
var x = 20;
}
foo()

so问题来了，结果为什么是undefined而不是10呢？欲知详情请继续阅读。

js执行分为两个过程：进入上下文与执行上下文。

1、进入上下文阶段

1
function foo(x){
 var y = 20;
 function z(){}
}
foo(10);

当js进入上下文时（代码执行之前）会为foo函数创建一个执行上下文。执行上下文会存储foo函数的形参、函数声明、变量声明。

1
{
    z: <function reference>
    y: undefined
    x: undefined
}

注意：当函数声明与变量声明同一个属性时，函数声明的属性会替换掉变量声明的属性。

2、执行上下文阶段

1
function foo(x){
    console.log(y);
    var y = 20;
    console.log(y);
    function z(){}
}
foo(10);

当函数执行到第一个打印语句时，还没有为变量y赋值，上下文变为

1
{
    z: <function reference>,
    y: undefined,
    x: 10
}

输出结果为undefined。

当函数执行到第二个打印语句时，上下文变为

1
{
    z: <function reference>,
    y: 20,
    x: 10
}

输出结果为 20。