news 2026/8/20 15:30:58

JavaScript高级系列(三) - JavaScript的运行过程

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
JavaScript高级系列(三) - JavaScript的运行过程

一. 全局代码的执行过程

1.1. ECMA的版本说明

在ECMA早期的版本(ECMAScript3),代码的执行流程的术语和ECMAScript5以及之后的术语会有所区别:
目前网上大多数流行的说法都是基于ECMAScript3版本的解析,
并且在面试问到的大多数都是ECMAScript3的版本内容;
ECMAScript3终将过去, ECMAScript5必然会成为主流,所以最好也理解ECMAScript5甚至包括ECMAScript6以及更好版本的内容;

事实上在TC39( ECMAScript5 )的最新描述中,和ECMAScript5之后的版本又出现了一定的差异;那么按照如下顺序学习:
a. 通过ECMAScript3中的概念学习JavaScript执行原理、作用域、作用域链、闭包等概念;
b. 通过ECMAScript5中的概念学习块级作用域、let、const等概念;

它们只是在对某些概念上的描述不太一样,在整体思路上都是一致的。

1.2. 全局代码初始化

假如我们有下面一段代码,它在JavaScript中是如何被执行的呢?

varname="wulin"functionfoo(){varname="foo"console.log(name)}varnum1=20varnum2=30varresult=num1+num2foo()

1.2.1. 初始化全局对象

js引擎会在执行代码之前,会在堆内存中创建一个全局对象:

Global Object(GO) 该对象 所有的作用域(scope)都可以访问;
里面会包含Date、Array、String、Number、setTimeout、setInterval等等;
其中还有一个window属性指向自己;

1.2.2. 执行上下文(EC)

在 JavaScript 引擎内部,有一个执行上下文栈(Execution Context Stack,简称 ECS),它是用于执行代码的调用栈,存储着当前正在执行的执行上下文。
当 JavaScript 引擎开始执行代码时,它会先创建一个全局执行上下文(Global Execution Context,简称 GEC),并将其推入 ECS 中,表示当前正在执行全局的代码块。

GEC 包含了两部分内容:
第一部分是在代码执行前,JavaScript 引擎会扫描全局作用域下的变量和函数,将它们添加到全局对象(Global Object)中,并分配内存空间,但是并不会赋值。这个过程称为变量的作用域提升(hoisting)。
第二部分是在代码执行中,JavaScript 引擎会对变量进行赋值,并执行其他的函数。

1.3. 全局代码的执行

1.3.1. VO和GO的理解

每一个执行上下文会关联一个VO(Variable Object,变量对象),变量和函数声明会被添加到这个VO对象中。
变量对象是一个抽象的概念,在 JavaScript 引擎内部,它被实现为一个与当前执行上下文相关联的对象。

在全局执行上下文中,变量对象是全局对象(Global Object); 在函数执行上下文中,变量对象是一个称为活动对象(Activation Object)的对象。

当全局代码被执行的时候,VO就是GO对象了

当全局代码被执行时,变量对象(Variable Object,简称 VO)就是全局对象(Global Object,简称 GO)了。
全局对象是在 JavaScript 引擎内部创建的一个唯一对象,它在全局作用域下被访问,并且可以存储全局变量、函数、内置对象和浏览器提供的 API 等等。

1.3.2. 全局代码执行过程(执行前)

GO 对象在执行全局代码之前就已经被创建,并且包含了一些内置对象和方法,例如 Object、Array、String、Number、Math、JSON、setTimeout、setInterval 等等。

当全局执行上下文被创建时,变量对象 VO 会被设置为 GO 对象,并且全局作用域下的变量和函数会被添加到变量对象中。

1.3.3. 全局代码执行过程(执行后)

代码执行后就会给变

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/8/20 15:30:47

【仿真基本功】【PyTorch】从头安装PyTorch【2025/02/21更新】

【仿真基本功】【PyTorch】从头安装PyTorch【2025/02/21更新】PyTorch完整安装步骤1. 安装Anaconda2. 查看显卡对CUDA版本的支持3. 查看PyTorch的安装需求4. 安装 PyTorcha) 配置新环境b) 进入新环境c) 按照 CUDA 版本要求,必须小于等于显卡支持的 CUDA 最高版本。d…

作者头像 李华
网站建设 2026/8/20 15:27:25

显卡内存测试终极指南:memtest_vulkan 免费检测GPU显存稳定性

显卡内存测试终极指南:memtest_vulkan 免费检测GPU显存稳定性 【免费下载链接】memtest_vulkan Vulkan compute tool for testing video memory stability 项目地址: https://gitcode.com/gh_mirrors/me/memtest_vulkan 凌晨两点,你的游戏角色正冲…

作者头像 李华
网站建设 2026/8/20 15:26:28

06:Planning Task State:Claude Code 怎么使用 plan 稳住任务

06:Planning & Task State:Claude Code 怎么使用 plan 稳住任务 上一篇讲 Context Management,重点是:Claude Code 每一轮到底让模型看见什么。 但模型看见材料以后,还要继续往前走一步。它需要把用户目标、项目…

作者头像 李华
网站建设 2026/8/20 15:24:49

Spring、MyBatis、Spring Boot核心原理深度解析:从源码到实战

如果你已经使用 Spring 框架开发了多个项目,却依然对Autowired注解背后发生了什么感到困惑,或者在面试中被问到“Spring 如何解决循环依赖”时只能回答“三级缓存”,却说不清其具体流程和设计意图,那么这篇文章就是为你准备的。很…

作者头像 李华