0

0

如何理解JavaScript中的执行上下文与词法环境?

betcha

betcha

发布时间:2025-10-06 16:47:02

|

747人浏览过

|

来源于php中文网

原创

执行上下文是JavaScript代码运行时的环境,分为全局、函数和eval三种,每个上下文经历创建和执行两个阶段,其中创建阶段初始化变量对象、作用域链和this指向;词法环境是执行上下文的一部分,由环境记录和对外部词法环境的引用组成,负责变量存储与作用域链查找;词法环境在函数定义时确定,支持闭包机制,使内层函数可访问外层变量。

如何理解javascript中的执行上下文与词法环境?

理解JavaScript中的执行上下文和词法环境,关键在于搞清楚代码运行时的“环境”是如何创建和管理的。每当JavaScript引擎执行一段代码时,都会先建立一个执行上下文,它决定了变量查找、函数调用和this指向的规则。而词法环境是执行上下文的一部分,负责存储变量和函数声明,并支持作用域链机制。

执行上下文:代码运行的环境

执行上下文可以理解为代码执行时的“工作台”。JavaScript中存在三种类型的执行上下文:

  • 全局执行上下文:代码首次运行时创建,只有一个。
  • 函数执行上下文:每次调用函数时创建,可能有多个。
  • eval执行上下文:在eval函数中运行代码时创建,通常不推荐使用。

每个执行上下文经历两个阶段:

  • 创建阶段:设置变量对象(VO)、建立作用域链、确定this指向。
  • 执行阶段:变量赋值、函数调用、代码逐行执行。

词法环境:变量与作用域的核心机制

词法环境是ES6规范中用来描述标识符如何与变量关联的结构。它由两部分组成:

立即学习Java免费学习笔记(深入)”;

  • 环境记录(Environment Record):记录当前作用域内的变量和函数声明。
  • 对外部词法环境的引用:用于访问外层作用域的变量,形成作用域链。

词法环境在代码定义时就已经确定(即“词法作用域”),而不是运行时动态决定。例如:

Cutout.Pro
Cutout.Pro

AI驱动的视觉设计平台

下载
function outer() {
  let a = 1;
  function inner() {
    console.log(a); // 能访问到outer中的a
  }
  inner();
}
outer();

在这里,inner函数的词法环境引用了outer函数的词法环境,因此可以沿着作用域链找到变量a。

词法环境与执行上下文的关系

在ES6规范中,每个执行上下文都包含一个词法环境组件,用于处理变量绑定。简单来说:

  • 执行上下文是运行时的概念,代表代码执行的环境。
  • 词法环境是执行上下文中负责变量存储和查找的具体结构。

当函数被调用时,会创建新的执行上下文,同时创建新的词法环境,并将外部词法环境的引用指向其外层函数或全局环境。

基本上就这些。掌握这两个概念,有助于理解闭包、变量提升和this指向等核心机制。不复杂但容易忽略的是,词法环境在函数定义时就已经确定,而不是调用时才决定。这个特性正是闭包能够访问外层变量的根本原因。

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

WorkBuddy
WorkBuddy

腾讯云推出的AI原生桌面智能体工作台

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
es6新特性
es6新特性

es6新特性有:1、块级作用域变量;2、箭头函数;3、模板字符串;4、解构赋值;5、默认参数;6、 扩展运算符;7、 类和继承;8、Promise。本专题为大家提供es6新特性的相关的文章、下载、课程内容,供大家免费下载体验。

106

2023.07.17

es6新特性有哪些
es6新特性有哪些

es6的新特性有:1、块级作用域;2、箭头函数;3、解构赋值;4、默认参数;5、扩展运算符;6、模板字符串;7、类和模块;8、迭代器和生成器;9、Promise对象;10、模块化导入和导出等等。本专题为大家提供es6新特性的相关的文章、下载、课程内容,供大家免费下载体验。

197

2023.08.04

JavaScript ES6新特性
JavaScript ES6新特性

ES6是JavaScript的根本性升级,引入let/const实现块级作用域、箭头函数解决this绑定问题、解构赋值与模板字符串简化数据处理、对象简写与模块化提升代码可读性与组织性。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

234

2025.12.24

mysql标识符无效错误怎么解决
mysql标识符无效错误怎么解决

mysql标识符无效错误的解决办法:1、检查标识符是否被其他表或数据库使用;2、检查标识符是否包含特殊字符;3、使用引号包裹标识符;4、使用反引号包裹标识符;5、检查MySQL的配置文件等等。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

213

2023.12.04

Python标识符有哪些
Python标识符有哪些

Python标识符有变量标识符、函数标识符、类标识符、模块标识符、下划线开头的标识符、双下划线开头、双下划线结尾的标识符、整型标识符、浮点型标识符等等。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

325

2024.02.23

java标识符合集
java标识符合集

本专题整合了java标识符相关内容,想了解更多详细内容,请阅读下面的文章。

293

2025.06.11

c++标识符介绍
c++标识符介绍

本专题整合了c++标识符相关内容,阅读专题下面的文章了解更多详细内容。

179

2025.08.07

go语言闭包相关教程大全
go语言闭包相关教程大全

本专题整合了go语言闭包相关数据,阅读专题下面的文章了解更多相关内容。

153

2025.07.29

TypeScript类型系统进阶与大型前端项目实践
TypeScript类型系统进阶与大型前端项目实践

本专题围绕 TypeScript 在大型前端项目中的应用展开,深入讲解类型系统设计与工程化开发方法。内容包括泛型与高级类型、类型推断机制、声明文件编写、模块化结构设计以及代码规范管理。通过真实项目案例分析,帮助开发者构建类型安全、结构清晰、易维护的前端工程体系,提高团队协作效率与代码质量。

49

2026.03.13

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
React 教程
React 教程

共58课时 | 6.1万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 3.5万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3.6万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号