JS执行上下文

先看个小例子

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

为什么打印出来的是 undefined 呢？

执行上下文概念

当代码运行时，会产生一个对应的执行环境，在这个环境中，所有变量会被事先提出来（变量提升），有的直接赋值，有的为默认值 undefined，代码从上往下开始执行，就叫做执行上下文。

在 JavaScript 的世界里，运行环境有三种，分别是：
　　　　1.全局环境：代码首先进入的环境
　　　　2.函数环境：函数被调用时执行的环境
　　　　3.eval函数：https://www.cnblogs.com/chaoguo1234/p/5384745.html（不常用）

执行上下文特点

1.单线程，在主进程上运行
　　2.同步执行，从上往下按顺序执行
　　3.全局上下文只有一个，浏览器关闭时会被弹出栈
　　4.函数的执行上下文没有数目限制
　　5.函数每被调用一次，都会产生一个新的执行上下文环境

执行上下文栈

执行全局代码时，会产生一个执行上下文环境，每次调用函数都又会产生执行上下文环境。当函数调用完成时，这个上下文环境以及其中的数据都会被消除，再重新回到全局上下文环境。处于活动状态的执行上下文环境只有一个。
　　其实这是一个压栈出栈的过程——执行上下文栈。
　　压栈出栈过程

var                                  // 1.进入全局上下文环境
a = 10,
fn,
bar = function(x){
        var b = 20;
        fn(x + b);               // 3.进入fn上下文环境
}
fn = function(y){
    var c = 20;
    console.log(y + c);    
}
bar(5);                              // 2.进入bar上下文环境

执行上下文生命周期

如图所示，执行上下文共分3个阶段，分别是：
1.创建阶段
　　　　　　(1).生成变量对象
　　　　　　(2).建立作用域链
　　　　　　(3).确定 this 指向
2.执行阶段
　　　　　　(1).变量赋值
　　　　　　(2).函数引用
　　　　　　(3).执行其他代码
3.销毁阶段
　　　　　　执行完毕出栈，等待回收被销毁
　　所以上面小例子等同于：

function fn(){
    var a;
    console.log(a);
    a = 1;    
}

fn();