javascript原理--> 执行上下文栈

111 阅读2分钟

执行上下文栈

可以通俗的理解为,js引擎有一个loop工作机制,一直持续不断的从一个 stack中 读取可用于执行的函数代码。

// 伪代码
while(stack.pop()) {
    execute(fn)
}

执行上下文栈的创建过程

在执行上下文栈的底部始终存在一个全局上下文,直到窗口关闭。

当执行某个函数的时候,js引擎会创建这个函数的执行上下文,压入栈中。

函数执行完毕,会出栈。


// 
ECStack = [
    globalContext
];

// 声明三个函数
function B() {
    // some code
}

function A() {
    B();
}

A();

A() 函数执行时,此时栈结构为

[globalContext, A(functionContext), B(functionContext)]

执行上下文

函数执行的时候会创建执行上下文入栈。

对于每个执行上下文,都有三个重要属性:

  • 变量对象(Variable object,VO)
  • 作用域链(Scope chain)
  • this

变量对象

变量对象会包括:

  1. 函数的所有形参 (如果是函数上下文)

    • 由名称和对应值组成的一个变量对象的属性被创建
    • 没有实参,属性值设为 undefined
  2. 函数声明

    • 由名称和对应值(函数对象(function-object))组成一个变量对象的属性被创建
    • 如果变量对象已经存在相同名称的属性,则完全替换这个属性
  3. 变量声明

    • 由名称和对应值(undefined)组成一个变量对象的属性被创建;
    • 如果变量名称跟已经声明的形式参数或函数相同,则变量声明不会干扰已经存在的这类属性

作用域链

查找变量的时候,会先从当前上下文的变量对象中查找,

如果没有找到,就会从父级执行上下文的变量对象中查找,

一直找到全局上下文的变量对象,也就是全局对象。

这样由多个执行上下文的变量对象构成的链表就叫做作用域链。

this

在全局执行上下文中,this 总是指向全局对象。例如:浏览器环境下 this 指向 window 对象。

在函数执行上下文中,this 的值取决于函数的调用方式,如果被一个对象调用,那么 this 指向这个对象。否则(在浏览器中) this 一般指向全局对象 window 或者 undefined (严格模式)。

总结

陆续完善