JS基础之作用域链

news2024/12/23 7:32:07

JS基础之作用域链

  • 作用域链
    • 作用域链
    • 函数创建
    • 函数激活
    • 总结

作用域链

当JavaScript代码执行一段可执行的代码(execution code)时,会创建对应的执行上下文(execution context)。
对于每个执行上下文,都有三个重要的属性:

  • 变量对象(Varable object,VO)
  • 作用域链(Scope chain)
  • this
    本节来简单了解一下作用域链

作用域链

上节变量对象我们说到,当查找变量的时候,会先从当前上下文的变量对象中查找,如果没有找到,就会从父级(词法层面上的父级)执行上下文的变量对象中查找,一直找到全局上下文的变量对象,也就是全局对象,这样由多个执行上下文的变量对象构成的链表就叫做作用域链

函数创建

我们在词法作用域和动态作用域中讲到,函数的作用域在定义函数的时候就决定了。
这是因为函数有一个内部属性[[scope]],当函数创建的时候,就会保存所有父变量对象到其中,你可以理解[[scope]]就是所有父变量对象的层级连,但是注意[[scope]]并不代表完整的作用域链!
举个栗子:

function foo(){
	function bar(){
		...
	}
}

函数创建时,各自的[[scope]]为:

foo.[[scope]]=[
	globalConext.VO
];
bar.[[scope]] = [
	fooContext.AO,
	globalContext.VO
];

函数激活

当函数激活时,进入函数上下文,创建VO/AO后,就会将活动对象添加到作用链的前端。
这时候执行上下文的作用域链,我们命名为Scope:

Scope = [AO].concat([[Scope]]);

至此,作用域链创建完毕。

总结

结合着之前讲的变量对象和执行上下文栈,我们来总结一下函数执行上下文中作用域链和变量对象的创建过程:

var scope = "global scope";
function checkscope(){
	var scope2 = "local scope";
	return scope2;
}
checkscope();

执行过程如下:

  1. checkscope函数被创建,保存作用域链到内部属性[[scope]]
checkscope.[[scope]] = [
	globalContext.VO
];
  1. 执行checkscope函数,创建checkscope函数执行上下文,checkscope函数执行上下文被压入执行上下文栈
ECStask = [
	checkscopeContext.AO,
	globalContext.VO
];
  1. checkscope函数并不立刻执行,开始做准备工作,第一步:复制函数[[scope]]属性创建作用域链
checkscopeContext = {
	Scope:checkscope.[[scope]],
}
  1. 第二步:用arguments创建活动对象,随后初始化活动对象,加入形参、函数声明、变量声明
checkscopeContext = {
	AO:{
		arguments:{
			length:0
		},
		scope2:undefined
	},
	Scope:checkscope.[[scope]],
}
  1. 第三部:将活动对象压入checkscope作用域链顶端
checkscopeContext = {
	AO:{
		arguments:{
			length:0
		},
		scope2:undefined
	},
	Scope:[AO,[[Scope]]]
}

6.准备工作完成,开始执行函数,随着函数的执行,修改AO的属性值。

checkscopeContext = {
	AO: {
		arguments:{
			length:0
		},
		scope2:'local scope'
	},
	Scope:[AO,[[Scope]]]
}
  1. 查找到scope2的值,返回后函数执行完毕,函数上下文从执行上下文栈中弹出。
ECStask = [
	globalContext.VO
];

好啦!本节就讲到这里啦!
拓展一个小知识:AO和VO的关系
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1309046.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

beanshell、jcef

BeanShell BeanShell是一个小型嵌入式Java源代码解释器,具有对象脚本语言特性,能够动态地执行标准JAVA语法。 BeanShell不仅仅可以通过运行其内部的脚本来处理Java应用程序,还可以在运行过程中动态执行你java应用程序执行java代码。因为Bea…

计算机网络传输层(期末、考研)

计算机网络总复习链接🔗 目录 传输层的功能端口UDP协议UDP数据报UDP的首部格式UDP校验 TCP协议(必考)TCP报文段TCP连接的建立TCP连接的释放TCP的可靠传输TCP的流量控制零窗口探测报文段 TCP的拥塞控制慢开始和拥塞控制快重传和快恢复 TCP和U…

【网络编程之初出茅庐】

前言:本章主要先讲解一些基本的网络知识,先把基本的知识用起来,后续会更深入的讲解底层原理。 网络编程的概念 网络编程,指网络上的主机,通过不同的进程,以编程的方式实现网络通信(或称为网络数…

SAP 标准GUI 中增加按钮时报错:EC181

今天在打一个note的时候,需要做一些手动的调整,其中的步骤就需要我去在标准的GUI STATUS 增加按钮 我在进入编辑模式的时候,直接去插入的时候,始终报错如下: Function code xxxx has not been assigned to a functio…

数据结构与算法:插入排序

原理 保证区间内排好顺序,逐渐将区间外数据插入到该区间中。 从局部扩散到整体。 第一次:保证0-1范围内有序 arr[0]和arr[1]对比,若arr[0] 大于 arr[1] ,交换两个值, 0-1范围内有序。 第二次:保证 0-2 …

蓝牙物联网全屋智能系统解决方案

#蓝牙物联网# 蓝牙物联网全屋智能系统解决方案是一种通过低功耗蓝牙技术将家中的各种设备连接到一起,实现家居物联智能操控的方案。 全屋智能系统解决方案是一种将智能家居设备、传感器、照明、安防等系统集成在一起,实现全屋智能化控制的方案。 蓝牙物…

如何用python编写抢票软件,python爬虫小程序抢购

大家好,小编来为大家解答以下问题,python小程序抢购脚本怎么写,如何用python编写抢票软件,现在让我们一起来看看吧! 大家好,小编来为大家解答以下问题,python小程序抢购脚本怎么写,如…

【剑指offer|图解|二分查找】点名 + 统计目标成绩的出现次数

🌈个人主页:聆风吟 🔥系列专栏:数据结构、剑指offer每日一练 🔖少年有梦不应止于心动,更要付诸行动。 文章目录 一. ⛳️点名1.1 题目1.2 示例1.3 限制1.4 解题思路一c代码 1.5 解题思路二c代码 二. ⛳️统…

ARM I2C通信

1.概念 I2C总线是PHLIPS公司在八十年代初推出的一种串行的半双工同步总线,主要用于连接整体电路2.IIC总线硬件连接 1.IIC总线支持多主机多从机,但是在实际开发过程中,大多数采用单主机多从机模式 2.挂接到IIC总线上,每个从机设备都…

leetcode--1004 最大连续1的个数 III[滑动窗口c++]

原题链接: 3. 无重复字符的最长子串 - 力扣(LeetCode) 题目解析: 题目的翻转0,意思就是把0变成1; 将题的 最多可翻转k个0 操作看成 限定范围内最多可有k个0(等价转换) 因为实…

js 时间字符串截掉微秒后面的内容及加1秒

老规矩先上效果图: 一、js 时间字符串截掉微秒后面的内容,保留前面的 let str 2023-11-27 19:08:34.733; let index str.lastIndexOf(".") str str.substring(0, index); console.log(str) // 2023-11-27 19:08:34 二、转成时间戳,加1秒的…

人机融合与意图理解

人机融合本质上是人类智能与机器自动化之间的协同。 人机融合的目标是利用人类智能和机器自动化的优势,使二者相互补充、相互支持,共同实现更高效、更智能的工作和生活方式。 人类智能和机器自动化具有不同的特点和优势。人类智能具有创造性、灵活性、推…

VS Code串口监视插件Serial Monitor

文章目录 初步使用参数设置VS Code插件 初步使用 Serial Monitor,即串行监视器,提供串口和TCP协议的通信监控功能。在插件栏搜索安装之后,按下Ctrl打开终端,终端界面会多出一个串行监视器选项卡,进入之后,…

基于vue实现的疫情数据可视化分析及预测系统-计算机毕业设计推荐 django

本疫情数据可视化分析及预测系统 开发,用小巧灵活的MySQL数据库做完后台存储解释。本系统不仅主要实现了注册登录,系统首页,个人中心,用户管理,全国实时数据管理,每日实时数据管理,国内实时动态…

KUKA机器人如何在程序中编辑等待时间?

KUKA机器人如何在程序中编辑等待时间? 如下图所示,如何实现在P1点和P2点之间等待设定的时间? 如下图所示,可以直接输入wait sec 2(等待2秒), 如下图所示,再次选中该程序后&#…

ZLMediaKit中的线程

EventLoop的线程模型 服务器通用的IO模型event-loop 非阻塞IO。线程模型可以是单线程,可以是多线程。对于已经普及了的多核环境,通常都是采用多线程。 通常一个线程中有一个EventLoop,比如accept是一个专门线程,accept后的fd分…

I.MX RT1170双核学习(2):双核相互激活和启动流程

RT1170这个芯片带有双核:Cortex-M7和Corterx-M4,两个核都可以独立地运行,当然双核也可以同时运行。在上一篇文章中,介绍了一下在RT1170中消息模块MU的使用:双核通信之MU消息单元详解,因为这是双核之间用来通…

基于Dockerfile创建LNMP

实验组件 172.111.0.10:nginx docker-nginx 172.111.0.20:mysql docker-mysql 172.111.0.30:php docker-php 实验步骤 1.建立nginx-lnmp镜像及容器 cd /opt mkdir nginx cd nginx/ --上传nginx-1.22.0.tar.gz和wordpress-6.4.2-zh_C…

JOSEF 约瑟 时间继电器 DHC6A AC/DC100-240V 面板安装

特点 DIN(4848mm)标准面板尺寸 9 种工作模式可任意设定,简化外围线路,增强可靠性 带背光源 LCD 显示,在阳光或黑夜都能清晰显示 键保护可按要求锁定相关的按键,保护部分或全部的设定数据不受更 改,有效的防止误操…

02-详解请求路由的实现和常见的断言工厂

请求路由 路由转发 第一步: 新建一个SpringBoot工程如gateway模块, 引入网关依赖和nacos服务发现依赖 <!--网关依赖--> <dependency><groupId>org.springframework.cloud</groupId><artifactId>spring-cloud-starter-gateway</artifactId&…