浅入理解之执行上下文和作用域

111 阅读2分钟

一、执行上下文和执行上下文栈

1、执行上下文

1.1 什么是执行上下文ES(Execution Context)?

js代码在运行时,碰到全局环境、函数或者eval(不考虑)时会产生一个执行上下文,执行上下文就是全局或者函数代码在执行前和执行时的一系列规范。

1.2 执行上下文过程

第一步:

  • 变量、函数表达式声明,值为undfined
  • this生命且赋值
  • 函数声明且变量提升,如果是函数内部声明且初始化变量参数 第二部: 执行代码体,对一些变量进行赋值

1.3 VO(Variable Object)和AO(Active Object)

VO就是执行上下文中的变量和函数声明以及this,AO是出于当前活动执行上下文栈内的变量和函数声明以及this

2、执行上下文栈

2.1 什么是执行上下文栈(Execution Context Stack)?

由于js是单线程的代码执行是从上至下执行。

执行上下文栈就是进入执行上下文时会形成一个执行上下文栈,这个执行上下文栈规定了内部多个执行上下文有序执行,执行按照先进后出的规范。

有以下代码:
var a = 10;
function bar() {
    var b = 20;
    function fn() {
        var c = 30
    }
    fn()
}
bar()

代码运行,全局环境形成一个全局执行上下文,推入执行上下文栈内,此时活动上下文时全局上下文,代码执行到函数bar,新生成一个bar执行上下文环境,推入栈内,此时活动上下文是bar执行上下文,代码运行到函数fn,新生成fn执行上下文推入栈内,此时活动上下文变成fn执行上下文,fn代码执行完成,fn执行上下文退出上下文栈,bar执行完成,bar上下文推出上下文栈,一直到全局代码执行完成。

image.png

二、作用域和作用域链

1、作用域

作用域就是规定了内部变量对象的访问权限,变量对象的值在执行上下文时确定值。

2、作用域链

作用域链就是在访问一个变量对象时,查找这个变量的值会根据作用域的嵌套关系进行一个有序的查询,一直查询到全局作用域为止,没有则为undefined。

warning:js作用域是词法作用域,又叫静态作用域,在定义时已经确定了它的作用域以及作用域链,不会受到调用位置的影响,注意区分与this值的区别。

1、

var a = 10;
function foo() {
    console.log(a)
}
function bar() {
    var a = 30;
    foo();
}
bar();
}

上述代码在执行时,输出是多少?

2、

var a = 10;
function foo() {
    console.log(a)
    var a = 20;
}
function bar() {
    var a = 30;
    foo();
}
bar();
}

那上述代码执行时呢?

参考:segmentfault.com/a/119000000… www.cnblogs.com/wangfupeng1… www.cnblogs.com/wangfupeng1…