当前位置: 首页 > news >正文

理解Js执行上下文

执行上下文

执行上下文(Context)又称上下文,在 JavaScript 中是一个重要的概念,它决定了变量和函数的可访问性及其行为。每个上下文都有一个关联的变量对象(Variable Object),所有在该上下文中定义的变量和函数都存储在这个对象上。虽然无法通过代码直接访问变量对象,但它在后台处理数据时是必不可少的。

全局上下文

全局上下文是最外层的上下文,表示全局作用域中的所有内容。在浏览器中,这个上下文由 window 对象表示。所有通过 var 定义的全局变量和函数都会成为 window 对象的属性和方法。使用 let 和 const 声明的顶级变量不会定义在全局上下文中,但在作用域链解析上效果是一样的。

全局上下文在其所有代码执行完毕后会被销毁,通常在应用程序退出时(例如关闭网页或退出浏览器)。

函数上下文

每个函数调用都有自己的上下文。当代码执行流进入函数时,函数的上下文被推入上下文栈。在函数执行完后,上下文栈将弹出该函数的上下文,控制权返回到之前的执行上下文。ECMAScript 程序的执行流正是通过这个上下文栈进行控制的。

一. 执行上下文的组成与功能

执行上下文是代码执行时的环境,包含以下信息:

  • 变量对象:存储当前上下文中定义的所有变量和函数。
  • 活动对象:函数上下文中的特定变量对象,包括参数和局部变量。
  • 作用域链:用于查找变量的路径,确保在访问变量时遵循正确的顺序。

二. 变量对象与活动对象

1.变量对象

  • 全局上下文的变量对象是全局对象(如 window)。
  • 函数上下文的变量对象在函数被调用时创建,初始时仅包含一个特殊的 arguments 对象。

2.活动对象

活动对象(Activation Object)是一个抽象概念,用于表示在函数调用时其内部的变量和参数。虽然活动对象本身不是一个具体的对象,但它描述了函数执行时的环境和上下文。

活动对象是函数执行上下文中的变量对象的一个特定实例。当函数被调用时,会创建一个新的执行上下文,并且这个上下文中的变量对象被称为活动对象。活动对象除了包含arguments对象外,还会包含函数内部声明的所有局部变量、函数声明(注意,函数声明会提升,即它们会被添加到活动对象的顶部,即使它们在代码中的位置较低)和函数参数(如果参数名与arguments对象中的名称相同,则参数会覆盖arguments对象中的同名属性)。

(1). 活动对象的内容

在函数被调用时,活动对象会被创建,包含以下内容:

  • 局部变量:在函数内部定义的变量。
  • 参数:传递给函数的参数。
  • arguments 对象:包含所有传递给函数的参数的对象。
  • 函数声明:在函数内部定义的其他函数。
(2).执行顺序

在函数调用时,活动对象的内容会按照以下顺序被处理:

  1. 参数处理:当函数被调用时,传入的参数会被添加到活动对象中。
  2. 局部变量声明:在函数内部定义的变量会被初始化并存储在活动对象中。
  3. 函数声明:如果在函数内部有其他函数声明,这些函数会被提升到活动对象的顶部。

3.理解活动对象的抽象概念

  • 抽象性:活动对象是一个概念,用于描述函数执行时的环境,而不是一个具体的 JavaScript 对象。它帮助我们理解函数的作用域、变量生命周期和查找机制。
  • 作用域管理:活动对象通过存储局部变量和参数,确保每次函数调用都有一个独立的作用域。这使得不同的函数调用不会相互干扰。

4. 理解活动对象的独立作用域

function outerFunction() {let outerVar = '我在外部!';function innerFunction(innerVar) {console.log(outerVar); // 访问外部函数的变量console.log(innerVar);  // 访问内部函数的参数}innerFunction('我在内部!');
}outerFunction();

(1.)独立作用域

  • 当调用 outerFunction 时,创建了一个新的活动对象,包含 outerVar
  • 当调用 innerFunction 时,另一个独立的活动对象被创建,包含 innerVar

(2).变量查找

  • innerFunction 中的 console.log(outerVar) 查找首先在 innerFunction 的活动对象中查找变量,如果未找到,则沿着作用域链向上查找,找到 outerFunction 的活动对象,因此可以访问 outerVar
  • console.log(innerVar) 直接在 innerFunction 的活动对象中找到 innerVar
输出结果为:
我在外部!
我在内部!

5.变量对象与活动对象的关系

在函数调用时,活动对象是变量对象的一部分,专门用于管理该函数的参数和局部变量。所有的局部变量都存储在活动对象中,这使得函数能够独立于其他上下文工作

变量对象是更广泛的概念,是包含当前上下文所有变量和函数的集合,而活动对象专注于函数调用时的特定变量管理。两者共同确保了 JavaScript 的作用域和变量生命周期的有效管理。


三. 作用域链:

作用域链是查找变量的机制,是一个从当前上下文到全局上下文的链条:

1.查找顺序

  1. 首先检查当前执行上下文的活动对象。
  2. 如果没有找到,继续查找上层上下文的活动对象,直到全局上下文。

2.关系

作用域链确保了变量的访问顺序,当前上下文的变量对象始终位于链的最前端(从当前上下文执行)。如果在当前上下文中找不到变量,JavaScript 会沿着作用域链向上查找,直到找到变量或到达全局上下文。

四.总结:

执行上下文、变量对象、活动对象和作用域链是密切相关的概念。每次代码执行时,都会创建一个新的执行上下文,并形成一条作用域链来管理变量的查找。这些机制共同作用,使 JavaScript 能够有效地处理作用域和变量的生命周期。

理解这些概念对于掌握 JavaScript 的行为和调试代码至关重要,特别是在处理异步操作和闭包时。

相关文章:

理解Js执行上下文

执行上下文 执行上下文(Context)又称上下文,在 JavaScript 中是一个重要的概念,它决定了变量和函数的可访问性及其行为。每个上下文都有一个关联的变量对象(Variable Object),所有在该上下文中定义的变量和…...

微信小程序 蓝牙通讯

客户的需求如下:通过微信小程序控制蓝牙ble设备(电子面膜),通过不同指令控制面膜的亮度和时间。 01.首先看下客户的ble设备服务文档:(本部分需要有点蓝牙基础,在调试过程中可以用安卓软件nRF Connect软件来执行测试命令) 0xFFF1灯控命令 命…...

java后端项目技术记录

后端使用技术记录 一、软件1. apifox,API管理软件问题 2. nginx前端服务器(1) 反向代理(2) 负载均衡 二、问题1. 使用spring全局异常处理器处理特定的异常2. 扩展springmvc的消息转换器(对象和json数据的转换)3. 路径参数的接收4. 实体构建器…...

PostgreSQL数据库与PostGIS在Windows中的部署与运行

本文介绍在Windows电脑中,下载、安装、部署并运行PostgreSQL与PostGIS数据库服务的方法。 PostgreSQL是一种功能强大的开源关系型数据库管理系统(RDBMS),以其稳定性、可靠性和丰富的功能而闻名;其支持多种高级特性&…...

高级算法设计与分析 学习笔记10 平摊分析

动态表,可以变长。 一溢出就另起一个两倍大小的表。 可以轻易证明把n个数字放进去的时间复杂度是O(n),n n/2 n/4……也就2n,插入数字本身也就是n,加起来最多不超过3n. 这种复杂度究竟是怎么算的?毕竟每次插入复杂度…...

从“纸面算力”到“好用算力”,超聚变打通AI+“最后一公里”

如果要评选2024年的年度科技名词,AI当属最热门的候选项。 年初的《政府工作报告》中首次提出了“人工智能”行动,正在从顶层设计着手,加快形成以人工智能为引擎的新质生产力。 折射到市场层面,AI作为一种新的范式,不…...

【有啥问啥】具身智能(Embodied AI):人工智能的新前沿

具身智能(Embodied AI):人工智能的新前沿 引言 在人工智能(AI)的进程中,具身智能(Embodied AI)正逐渐成为研究与应用的焦点。具身智能不仅关注于机器的计算能力,更强调…...

11-pg内核之锁管理器(六)死锁检测

概念 每个事务都在等待集合中的另一事务,由于这个集合是一个有限集合,因此一旦在这个等待的链条上产生了环,就会产生死锁。自旋锁和轻量锁属于系统锁,他们目前没有死锁检测机制,只能靠内核开发人员在开发过程中谨慎的…...

Git 与标签管理

在 Git 中,标签 tag 是指向某个 commit 的指针(所以创建和删除都很快)。Git 有 commit id 了,为什么还要有 tag?commit id 是一串无规律的数字,不好记;而 tag 是我们自定义的,例如我…...

【0334】Postgres内核之 auxiliary process(辅助进程)初始化 MyPgXact

1. MyPgXact(ProcGlobal->allPgXact)间接初始化 在上一篇文章【0333】Postgres内核之 auxiliary process(辅助进程)创建 PGPROC 中, 讲解了Postgres内核完成 AuxiliaryProcess 初始化 pid、lxid、procLatch、myProcLocks、lockGroupMembers等所有成员的过程。 这些成员…...

20.1 分析pull模型在k8s中的应用,对比push模型

本节重点介绍 : push模型和pull模型监控系统对比为什么在k8s中只能用pull模型的k8s中主要组件的暴露地址说明 push模型和pull模型监控系统 对比下两种系统采用的不同采集模型,即push型采集和pull型采集。不同的模型在性能的考虑上是截然不同的。下面表格简单的说…...

Ubuntu 镜像替换为阿里云镜像:简化你的下载体验

Ubuntu,作为一款广受欢迎的Linux发行版,以其稳定性和易用性著称。但你是否曾因为下载速度慢而感到沮丧?现在,你可以通过将Ubuntu的默认下载源替换为阿里云镜像来解决这个问题。本文将指导你如何完成这一过程。 为什么选择阿里云镜…...

The Sandbox 游戏制作教程第 6 章|如何使用装备制作出色的游戏 —— 避免环境危险

欢迎回到我们的系列,我们将记录 The Sandbox Game Maker 的 “On-Equip”(装备)功能的多种用途。 如果你刚加入 The Sandbox,装备功能是 “可收集组件”(Collectable Component)中的一个多功能工具&#xf…...

JavaScript中的输出方式

1. console.log() console.log() 是开发者在调试代码时最常用的方法。它将信息打印到浏览器的控制台,使开发者能够查看变量的值、程序的执行状态以及其他有用的信息。 用途:用于调试和记录程序运行时的信息。优点:简单易用,适合…...

力扣9.25

2306. 公司命名 给你一个字符串数组 ideas 表示在公司命名过程中使用的名字列表。公司命名流程如下: 从 ideas 中选择 2 个 不同 名字,称为 ideaA 和 ideaB 。 交换 ideaA 和 ideaB 的首字母。 如果得到的两个新名字 都 不在ideas 中,那么 …...

从零开始之AI面试小程序

从零开始之AI面试小程序 文章目录 从零开始之AI面试小程序前言一、工具列表二、开发部署流程1. VMWare安装2. Centos安装3. Centos环境配置3.1. 更改子网IP3.2. 配置静态IP地址 4. Docker和Docker Compose安装5. Docker镜像加速源配置6. 部署中间件6.1. MySQL部署6.2. Redis部署…...

Html2OpenXml:HTML转化为OpenXml的.Net库,轻松实现Html转为Word。

推荐一个开源库,轻松实现HTML转化为OpenXml。 01 项目简介 Html2OpenXml 是一个开源.Net库,旨在将简单或复杂的HTML内容转换为OpenXml组件。 该项目始于2009年,最初是为了将用户评论转换为Word文档而设计的 随着时间的推移,Ht…...

HumanNeRF:Free-viewpoint Rendering of Moving People from Monocular Video 精读

1. 姿态估计和骨架变换模块 人体姿态估计:HumanNeRF 通过已知的单目视频对视频中人物的姿态进行估计。常见的方法是通过人体姿态估计器(如 OpenPose 或 SMPL 模型)提取人物的骨架信息,获取 3D 关节的位置信息。这些关节信息可以帮…...

Springboot中基于注解实现公共字段自动填充

1.使用场景 当我们有大量的表需要管理公共字段,并且希望提高开发效率和确保数据一致性时,使用这种自动填充方式是很有必要的。它可以达到一下作用 统一管理数据库表中的公共字段:如创建时间、修改时间、创建人ID、修改人ID等,这些…...

Android 已经过时的方法用什么新方法替代?

过时修正举例 (Kotlin): getColor(): resources.getColor(R.color.white) //已过时// 修正后:ContextCompat.getColor(this, R.color.white) getDrawable(): resources.getDrawable(R.mipmap.test) //已过时//修正后:ContextCompat.getDrawable(this, R.mipmap.test) //…...

【Axure高保真原型】引导弹窗

今天和大家中分享引导弹窗的原型模板,载入页面后,会显示引导弹窗,适用于引导用户使用页面,点击完成后,会显示下一个引导弹窗,直至最后一个引导弹窗完成后进入首页。具体效果可以点击下方视频观看或打开下方…...

观成科技:隐蔽隧道工具Ligolo-ng加密流量分析

1.工具介绍 Ligolo-ng是一款由go编写的高效隧道工具,该工具基于TUN接口实现其功能,利用反向TCP/TLS连接建立一条隐蔽的通信信道,支持使用Let’s Encrypt自动生成证书。Ligolo-ng的通信隐蔽性体现在其支持多种连接方式,适应复杂网…...

反向工程与模型迁移:打造未来商品详情API的可持续创新体系

在电商行业蓬勃发展的当下,商品详情API作为连接电商平台与开发者、商家及用户的关键纽带,其重要性日益凸显。传统商品详情API主要聚焦于商品基本信息(如名称、价格、库存等)的获取与展示,已难以满足市场对个性化、智能…...

基础测试工具使用经验

背景 vtune,perf, nsight system等基础测试工具,都是用过的,但是没有记录,都逐渐忘了。所以写这篇博客总结记录一下,只要以后发现新的用法,就记得来编辑补充一下 perf 比较基础的用法: 先改这…...

Spring Cloud Gateway 中自定义验证码接口返回 404 的排查与解决

Spring Cloud Gateway 中自定义验证码接口返回 404 的排查与解决 问题背景 在一个基于 Spring Cloud Gateway WebFlux 构建的微服务项目中,新增了一个本地验证码接口 /code,使用函数式路由(RouterFunction)和 Hutool 的 Circle…...

Pinocchio 库详解及其在足式机器人上的应用

Pinocchio 库详解及其在足式机器人上的应用 Pinocchio (Pinocchio is not only a nose) 是一个开源的 C 库,专门用于快速计算机器人模型的正向运动学、逆向运动学、雅可比矩阵、动力学和动力学导数。它主要关注效率和准确性,并提供了一个通用的框架&…...

Java编程之桥接模式

定义 桥接模式(Bridge Pattern)属于结构型设计模式,它的核心意图是将抽象部分与实现部分分离,使它们可以独立地变化。这种模式通过组合关系来替代继承关系,从而降低了抽象和实现这两个可变维度之间的耦合度。 用例子…...

基于Java+VUE+MariaDB实现(Web)仿小米商城

仿小米商城 环境安装 nodejs maven JDK11 运行 mvn clean install -DskipTestscd adminmvn spring-boot:runcd ../webmvn spring-boot:runcd ../xiaomi-store-admin-vuenpm installnpm run servecd ../xiaomi-store-vuenpm installnpm run serve 注意:运行前…...

探索Selenium:自动化测试的神奇钥匙

目录 一、Selenium 是什么1.1 定义与概念1.2 发展历程1.3 功能概述 二、Selenium 工作原理剖析2.1 架构组成2.2 工作流程2.3 通信机制 三、Selenium 的优势3.1 跨浏览器与平台支持3.2 丰富的语言支持3.3 强大的社区支持 四、Selenium 的应用场景4.1 Web 应用自动化测试4.2 数据…...

Unity UGUI Button事件流程

场景结构 测试代码 public class TestBtn : MonoBehaviour {void Start(){var btn GetComponent<Button>();btn.onClick.AddListener(OnClick);}private void OnClick(){Debug.Log("666");}}当添加事件时 // 实例化一个ButtonClickedEvent的事件 [Formerl…...