美文网首页
JS中的执行上下文

JS中的执行上下文

作者: js好难学啊 | 来源:发表于2018-12-10 12:39 被阅读0次

执行上下文

1. 定义

执行上下文就是js代码被解析和执行时所在环境的抽象概念,js的所有代码都是在执行上下文中运行。

2. 类型

执行上下文有三种类型:

  • 全局执行上下文:
    一个程序中只能存在一个全局执行上下文,不在任何函数中的代码都在全局执行上下文中。

  • 函数执行上下文:
    每次调用函数都会创建一个新的执行上下文,一个程序中可以包含任意多个函数执行上下文

  • eval执行上下文

3. 内容

执行上下文也是一个对象!那么这个对象中包括了哪些内容呢
每一个执行上下文都包括三个属性:

  • 活动对象(variable object)
  • 作用域链(scope chain)
  • this对象

4. 执行栈

存储执行上下文的数据结构是堆栈,它是一种先进后出的数据结构, 称其为执行栈

存储过程

1.当js引擎首次读取读取脚本时,便会创建一个全局执行上下文,并将其压入栈底,

  1. 如果执行期间碰到了函数,便会创建一个新的函数执行上下文。
  2. 在执行2中函数的时候又碰到了一个函数,便会再次创建一个新的执行上下文。。。
  3. 当某一个函数执行完毕,也将其执行上下文中堆栈中出栈,并将控制权交还给前一个执行上下文。
  4. 最终所有函数执行上下文出栈,仅剩下全局之执行上下文也出栈,程序执行完毕。应该是当浏览器被关闭,全局执行上下文才会被销毁!

5.举个例子

function f1() {
  console.log('f1')
}

function f2() {
  f1()
  console.log('f2')
}

function f3() {
  f2()
}

f3()

我们假设一开始的上下文执行栈为 []

  1. 当上例代码加载时,js引擎会创建一个全局执行上下文并压入栈底。
    更新执行栈为:
    [ [全局执行上下文]]

  2. 执行到了函数f3,创建f3的执行上下文
    [[f3的执行上下文]
    [全局执行上下文]]

  3. 执行f3的过程中,碰到了f2!赶紧创建f2的执行上下文
    [[f2的执行上下文]
    [f3的执行上下文]
    [全局执行上下文]]

  4. 执行f2的过程中,又碰到了f1!又赶紧创建f1的执行上下文
    [[f1的执行上下文]
    [f2的执行上下文]
    [f3的执行上下文]
    [全局执行上下文]]

  5. f1执行完毕了 就把f1的执行上下文出栈吧,并丢还给f2的执行上下文
    [[f1的执行上下文]
    [f2的执行上下文]
    [f3的执行上下文]
    [全局执行上下文]]、

  6. f2也执行完了, 还给f3吧
    [[f1的执行上下文]
    [f2的执行上下文]
    [f3的执行上下文]
    [全局执行上下文]]、

  7. f3委屈的将执行权还给了全局执行上下文
    [[f1的执行上下文]
    [f2的执行上下文]
    [f3的执行上下文]
    [全局执行上下文]]、

  8. 全局执行上下文结束,全部出栈 执行栈为 []
    [[f1的执行上下文]
    [f2的执行上下文]
    [f3的执行上下文]
    [全局执行上下文]]

相关文章

  • 我的JS笔记 -- 执行上下文

    执行上下文,就是Js执行的时候的一个运行环境/作用域(scope)。执行上下文决定了Js执行过程中可以获取哪些变量...

  • 闭包和this

    执行上下文 执行上下文是什么 可以简单理解执行上下文是js代码执行的环境,当js执行一段可执行代码时,会创建对应的...

  • JS-变量提升/函数提升

    首先了解执行上下文(EC)【你不知道的JavaScript】(三)执行上下文及其生命周期JS中的执行上下文(Exe...

  • js 随笔

    js 执行机制: js执行上下文: 只有理解了js 执行上下文才能更好的理解 js变量提升以及 作用域和闭包 所谓...

  • JS Context

    js的执行上下文 在js中,执行上下文保存着函数执行所需的重要信息,其中包括了三个属性: 变量对象作用域链this...

  • JS中的执行上下文

    执行上下文 1. 定义 执行上下文就是js代码被解析和执行时所在环境的抽象概念,js的所有代码都是在执行上下文中运...

  • 深入学习JS执行--创建执行上下文(变量对象,作用域链,this

    一、介绍 这次我们来深入了解js执行过程中的执行上下文。 本篇涉及到的名词:预执行,执行上下文,变量对象,活动对象...

  • 函数的底层处理机制

    js上下文分类 js上下文(哪一个区域下执行)分类: 1.全局上下文EC(G) 2.函数执行形成...

  • 执行上下文(个人笔记)

    本文参考:javaScript执行上下文和执行上下文栈一篇文章看懂JS执行上下文什么是执行上下文?什么是调用栈? ...

  • JS对象模型 - 执行模型

    对象 js的对象模型,执行上下文

网友评论

      本文标题:JS中的执行上下文

      本文链接:https://www.haomeiwen.com/subject/uvsrhqtx.html