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

JS中的上下文

  一.执行上下文的概念:

     执行上下文简称上下文。变量或者函数的上下文决定了它们可以访问哪些数据,以及它们的行为。每一个上下文都具有一个关联的变量对象,而这个上下文中定义的所有变量和函数都存在于这个对象上。

   二.JS中上下文的执行机制:

        全局上下文是最外层的上下文。根据ECMAScript实现的宿主环境,表示全局上下文的对象可能不一样。在浏览器中,window对象一般就是我们所说的全局上下文,因此所有通过var定义的全局变量都会绑定在window对象上,但是使用let和const定义的变量则不会定义在全局上下文中。执行上下文是JS代码在执行时的环境抽象,它包括了变量对象,作用域链,this指向等信息。

        每个函数流都有自己的上下文。当代码执行流进入函数时,函数的上下文被推到一个上下文栈上。在函数执行完毕之后,上下文栈就会弹出该函数的上下文,把控制权交还给之前的执行上下文。JS中程序的执行流就是通过这个上下文栈进行控制的。

        上下文在其所有代码都执行完毕后会被销毁,包括定义在其上面的所有变量和函数,而全局上下文则会在应用程序退出前才会被销毁,比如关闭网页或者是退出浏览器。

    三.JS中上下文的生命周期:

        执行上下文的生命周期包括两个阶段:创建阶段和执行阶段。

        3.1创建阶段:

             首先会根据上下文的类型来创建一个空的变量对象,然后建立作用域链,作用域链是一个指向父级作用域的链表,用于查找变量的值;在全局上下文中,this的指向为全局对象。在函数内部,this的指向取决于函数的调用方式;然后将函数的参数,函数的声明和变量添加到变量对象中。

        3.2执行阶段:

             在执行阶段会按照如下步骤来进行:按照代码的顺序执行,对变量进行赋值等操作;然后通过作用域来查找变量的值,最后在函数上下文中执行函数体内的代码。

四.上下文的分类:

     4.1全局上下文:

           全局上下文是默认的,最外层的上下文。它存在于整个页面生命周期,负责全局变量的声明和函数的执行。

      4.2函数执行上下文:

           每当调用一个函数时,都会创建一个新的函数执行上下文。函数执行上下文在函数执行结束后被销毁。

       4.3Eval执行上下文:

            eval函数执行的代码会在一个新的执行上下文中运行,被称为eval执行上下文。

五.JS上下文中的作用域链:

 var color="blue";function changeColor(){if(color==="blue"){color="red";}else{color="blue"}}changeColor();

就这个例子而言,函数changeColor()的作用域链包括两个对象,一个是它自己的变量对象,一个就是全局上下文的变量对象。在这个函数内部之所以能够访问变量color,就是因为可以在作用域中找到这个变量。

var color="blue";function changeColor(){let antherColor="red";function swapColor(){let tempColor=antherColor;anthorColor=color;color=tempColor;//可以访问到color,antherColor和tempColor}//可以访问到color,antherColor,访问不到tempColorswapColor();}changeColor()//只能访问到color;

在面的例子中,设计三个上下文,全局上下文,changeColor()的局部上下文和swapColor()的局部上下文。在全局上下文中只有一个变量color和一个函数changeColor()。changeColor()的局部上下文中包括一个变量antherColor和一个函数swapColor() .但是在changeColor()中可以访问到全局上下文中的变量color。swapColor()的局部上下文中有一个变量tempColor,只能在这个上下文中访问到。在全局上下文和changeColor()的局部上下文中都无法访问到变量tempColor。但是在swapColor()中则可以访问另外两个上下文中的变量,因为它们都输父上下文。

        所以,内部上下文可以通过作用域链访问外部上下文中的一切,但是外部上下文无法访问内部上下文中的任何东西。因为在上下文中的连接是线性的,有序的。每个上下文都可以到上一级山下文中去搜索变量和函数,但是任何上下文都不能去下一级的上下文中去搜索。内部上下文首先从自己的变量对象开始搜索变量和函数,搜索不到就去搜索上一级变量对象。

 

        

       

相关文章:

JS中的上下文

一.执行上下文的概念: 执行上下文简称上下文。变量或者函数的上下文决定了它们可以访问哪些数据,以及它们的行为。每一个上下文都具有一个关联的变量对象,而这个上下文中定义的所有变量和函数都存在于这个对象上。 二.JS中上下文的执行机制&a…...

【深度学习】注意力机制

https://blog.csdn.net/weixin_43334693/article/details/130189238 https://blog.csdn.net/weixin_47936614/article/details/130466448 https://blog.csdn.net/qq_51320133/article/details/138305880 注意力机制:在处理信息的时候,会将注意力放在需要…...

安卓开发自定义时间日期显示组件

安卓开发自定义时间日期显示组件 问题背景 实现时间和日期显示,左对齐和对齐两种效果,如下图所示: 问题分析 自定义view实现一般思路: (1)自定义一个View (2)编写values/attrs.…...

IT行业入门,如何假期逆袭,实现抢跑

目录 前言 1.IT行业领域分类 2.基础课程预习指南 3.技术学习路线 4.学习资源推荐 结束语 前言 IT(信息技术)行业是一个非常广泛和多样化的领域,它包括了许多不同的专业领域和职业路径。如果要进军IT行业,我们应该要明确自己…...

Pyramid 中混合认证策略

1. 问题背景 在一个使用 Pyramid 框架开发的应用程序中,需要同时处理 HTML 内容的显示和 JSON API 的请求。对于 HTML 内容,使用了 AuthTktAuthenticationPolicy 进行身份验证和 ACLAuthorizationPolicy 进行授权。当用户成功登录后,会在浏览…...

深度学习经典检测方法概述

一、深度学习经典检测方法 two-stage(两阶段):Faster-rcnn Mask-Rcnn系列 one-stage(单阶段):YOLO系列 1. one-stage 最核心的优势:速度非常快,适合做实时检测任务! 但是…...

<sa8650>sa8650 qcxserver-之-摄像头传感器VB56G4A驱动开发<1>

<sa8650>sa8650 qcxserver-之-摄像头传感器VB56G4A驱动开发 <1> 一、前言二、QCX架构三、QCX 传感器驱动程序定制开发3.1 sensor硬件接口3.2 sensor配置文件3.2.1 cameraconfig.c3.2.2 cameraconfigsa8650_water.c3.2.3 新增编译MK3.2.4 参数解析3.2.4.1 struct Camera…...

推荐8款超实用的ComfyUI绘画插件,帮助我们的AI绘画质量和效率提升几个档次!

前言 大家在使用SD绘画过程中&#xff0c;想必见识到了插件的强大功能&#xff0c;本身纯净版的SD界面是相对简洁的&#xff0c;但是搭配了各种插件后&#xff0c;界面标签栏会增加很多&#xff0c;相应的功能也增加了。 从简单的中文界面翻译插件&#xff0c;到强大的contro…...

MATLAB-振动问题:两自由度耦合系统自由振动

一、基本理论 二、MATLAB实现 以下是两自由度耦合系统自由振动质量块振动过程动画显示的MATLAB程序。 clear; clc; close allx0 1; D1 40; D12 8; D2 D1; m1 1; omega0 sqrt(D1/m1); k1 D12 / D1; k2 D12 / D2; k sqrt(k1 * k2); omegazh omega0 * sqrt(1 k); omeg…...

人工智能-NLP简单知识汇总01

人工智能-NLP简单知识汇总01 1.1自然语言处理的基本概念 自然语言处理难点&#xff1a; 语音歧义句子切分歧义词义歧义结构歧义代指歧义省略歧义语用歧义 总而言之&#xff1a;&#xff01;&#xff01;语言无处不歧义 1.2自然语言处理的基本范式 1.2.1基于规则的方法 通…...

Spring Boot中的异步编程技巧

Spring Boot中的异步编程技巧 大家好&#xff0c;我是免费搭建查券返利机器人省钱赚佣金就用微赚淘客系统3.0的小编&#xff0c;也是冬天不穿秋裤&#xff0c;天冷也要风度的程序猿&#xff01;今天我们将探讨在Spring Boot应用程序中如何使用异步编程技巧&#xff0c;以提升性…...

深度解密Spark性能优化之道

课程介绍 课程通过实战案例解析和性能调优技巧的讲解&#xff0c;帮助学员提升大数据处理系统的性能和效率。课程内容涵盖了Spark性能调优的各个方面&#xff0c;包括内存管理、并行度设置、数据倾斜处理、Shuffle调优、资源配置等关键技术和策略。学员将通过实际案例的演示和…...

在U盘/移动硬盘上安装热插拔式Ubuntu系统,并将Docker目录挂载到NTFS硬盘

Windows10的WSL2的确给开发人员带来了很多方便&#xff0c;但是仍然有很多缺点。比如&#xff1a;太占系统内存&#xff1b;有些软件无法在WSL2中编译成功&#xff1b;相当于虚拟机&#xff0c;性能不如原装系统。 装双系统&#xff0c;相信大家都不陌生&#xff0c;但它会占用…...

商城小程序论文(设计)开题报告

一、课题的背景和意义 近些年来&#xff0c;随着移动互联网巅峰时期的来临&#xff0c;互联网产业逐渐趋于“小、轻、微”的方向发展&#xff0c;符合轻应用时代特点的各类技术受到了不同领域的广泛关注。在诸多产品中&#xff0c;被誉为“运行着程序的网站”之名的微信小程序…...

15. Java的 CAS 操作原理

1. 前言 本节内容主要是对 CAS 操作原理进行讲解&#xff0c;由于 CAS 涉及到了并发编程包的使用&#xff0c;本节课程只对 CAS 的原理问题进行讲解&#xff0c;有助于同学后续对并发编程工具使用的学习。本节具体内容点如下&#xff1a; 了解 CAS 的概念&#xff0c;这是本节…...

修改element-ui日期下拉框datetimePicker的背景色样式

如图&#xff1a; 1、修改背景色 .el-date-picker.has-sidebar.has-time { background: #04308D; color: #fff; border: 1px solid #326AFF } .el-date-picker__header-label { color: #ffffff; } .el-date-table th { color: #fff; } .el-icon-d-arrow-left:before { color: …...

Linux—— 逻辑运算符,压缩和解压缩

- -a&#xff1a; and 逻辑与 - -o&#xff1a; or 逻辑或 - -not&#xff1a; not 逻辑非 - 优先级&#xff1a;与>或>非 shell [rootserver ~]# find / -size 10k -a -size -50k [rootserver ~]# find /etc -name "e*" -o -name "f*"…...

音视频入门基础:H.264专题(6)——FFmpeg源码:从H.264码流中提取NALU Header、EBSP、RBSP和SODB

音视频入门基础&#xff1a;H.264专题系列文章&#xff1a; 音视频入门基础&#xff1a;H.264专题&#xff08;1&#xff09;——H.264官方文档下载 音视频入门基础&#xff1a;H.264专题&#xff08;2&#xff09;——使用FFmpeg命令生成H.264裸流文件 音视频入门基础&…...

STM32实现按键单击、双击、长按、连按功能,使用状态机,无延时,不阻塞

常见的按键判定程序&#xff0c;如正点原子按键例程&#xff0c;只能判定单击事件&#xff0c;对于双击、长按等的判定逻辑较复杂&#xff0c;且使用main函数循环扫描的方式&#xff0c;容易被阻塞&#xff0c;或按键扫描函数会阻塞其他程序的执行。使用定时器设计状态机可以规…...

C#之Delta并联机械手的视觉同步分拣

本文导读 前面两节课程我们介绍了怎么建立Delta并联机械手的正逆解以及如何通过视觉进行匹配定位。本节课程给大家分享如何通过C#语言开发正运动Delta并联机械手传送带同步的视觉分拣。 VPLC711硬件介绍 VPLC711是正运动推出的一款基于x86平台和Windows操作系统的高性能机器…...

遍历 Map 类型集合的方法汇总

1 方法一 先用方法 keySet() 获取集合中的所有键。再通过 gey(key) 方法用对应键获取值 import java.util.HashMap; import java.util.Set;public class Test {public static void main(String[] args) {HashMap hashMap new HashMap();hashMap.put("语文",99);has…...

Docker 运行 Kafka 带 SASL 认证教程

Docker 运行 Kafka 带 SASL 认证教程 Docker 运行 Kafka 带 SASL 认证教程一、说明二、环境准备三、编写 Docker Compose 和 jaas文件docker-compose.yml代码说明&#xff1a;server_jaas.conf 四、启动服务五、验证服务六、连接kafka服务七、总结 Docker 运行 Kafka 带 SASL 认…...

【学习笔记】深入理解Java虚拟机学习笔记——第4章 虚拟机性能监控,故障处理工具

第2章 虚拟机性能监控&#xff0c;故障处理工具 4.1 概述 略 4.2 基础故障处理工具 4.2.1 jps:虚拟机进程状况工具 命令&#xff1a;jps [options] [hostid] 功能&#xff1a;本地虚拟机进程显示进程ID&#xff08;与ps相同&#xff09;&#xff0c;可同时显示主类&#x…...

企业如何增强终端安全?

在数字化转型加速的今天&#xff0c;企业的业务运行越来越依赖于终端设备。从员工的笔记本电脑、智能手机&#xff0c;到工厂里的物联网设备、智能传感器&#xff0c;这些终端构成了企业与外部世界连接的 “神经末梢”。然而&#xff0c;随着远程办公的常态化和设备接入的爆炸式…...

laravel8+vue3.0+element-plus搭建方法

创建 laravel8 项目 composer create-project --prefer-dist laravel/laravel laravel8 8.* 安装 laravel/ui composer require laravel/ui 修改 package.json 文件 "devDependencies": {"vue/compiler-sfc": "^3.0.7","axios": …...

听写流程自动化实践,轻量级教育辅助

随着智能教育工具的发展&#xff0c;越来越多的传统学习方式正在被数字化、自动化所优化。听写作为语文、英语等学科中重要的基础训练形式&#xff0c;也迎来了更高效的解决方案。 这是一款轻量但功能强大的听写辅助工具。它是基于本地词库与可选在线语音引擎构建&#xff0c;…...

#Uniapp篇:chrome调试unapp适配

chrome调试设备----使用Android模拟机开发调试移动端页面 Chrome://inspect/#devices MuMu模拟器Edge浏览器&#xff1a;Android原生APP嵌入的H5页面元素定位 chrome://inspect/#devices uniapp单位适配 根路径下 postcss.config.js 需要装这些插件 “postcss”: “^8.5.…...

论文笔记——相干体技术在裂缝预测中的应用研究

目录 相关地震知识补充地震数据的认识地震几何属性 相干体算法定义基本原理第一代相干体技术&#xff1a;基于互相关的相干体技术&#xff08;Correlation&#xff09;第二代相干体技术&#xff1a;基于相似的相干体技术&#xff08;Semblance&#xff09;基于多道相似的相干体…...

AGain DB和倍数增益的关系

我在设置一款索尼CMOS芯片时&#xff0c;Again增益0db变化为6DB&#xff0c;画面的变化只有2倍DN的增益&#xff0c;比如10变为20。 这与dB和线性增益的关系以及传感器处理流程有关。以下是具体原因分析&#xff1a; 1. dB与线性增益的换算关系 6dB对应的理论线性增益应为&…...

LLMs 系列实操科普(1)

写在前面&#xff1a; 本期内容我们继续 Andrej Karpathy 的《How I use LLMs》讲座内容&#xff0c;原视频时长 ~130 分钟&#xff0c;以实操演示主流的一些 LLMs 的使用&#xff0c;由于涉及到实操&#xff0c;实际上并不适合以文字整理&#xff0c;但还是决定尽量整理一份笔…...