0

0

ECMAScript 规范中的 for 循环:深入理解其执行机制与作用域管理

花韻仙語

花韻仙語

发布时间:2025-10-30 18:43:00

|

873人浏览过

|

来源于php中文网

原创

ecmascript 规范中的 for 循环:深入理解其执行机制与作用域管理

本文深入探讨了 ECMAScript 规范中 `for` 循环的执行机制,重点解析了其如何通过词法环境(LexicalEnvironment)管理作用域,特别是 `let` 和 `const` 声明的变量如何为每次迭代创建独立的绑定。我们将剖析 `ForLoopEvaluation`、`ForBodyEvaluation` 和 `CreatePerIterationEnvironment` 等抽象操作,揭示 `for` 循环在底层实现变量隔离的原理,并澄清相关概念,以帮助开发者更透彻地理解 JavaScript 的作用域行为。

1. for 循环的初始设置:ForLoopEvaluation

当 JavaScript 引擎遇到一个 for 循环语句,例如 for (let i = 0; i

  1. 创建循环环境 (loopEnv): 引擎会创建一个新的声明式环境记录(Declarative Environment Record),称之为 loopEnv。这个 loopEnv 的外部环境([[OuterEnv]])指向当前运行执行上下文的词法环境(oldEnv)。随后,当前运行执行上下文的 LexicalEnvironment 会被设置为这个新创建的 loopEnv。

  2. 绑定循环变量: 如果 for 语句的初始化部分包含词法声明(LexicalDeclaration,即使用 let 或 const 声明变量),这些变量的名称(boundNames)会在 loopEnv 中进行绑定。

    • 对于 const 声明的变量,会创建不可变绑定(ImmutableBinding)。
    • 对于 let 声明的变量,会创建可变绑定(MutableBinding)。 这些变量的初始值会通过评估 LexicalDeclaration 来设置。

这一步确保了循环变量(如 i)在循环外部环境之上拥有自己的独立作用域,为后续的迭代环境创建奠定了基础。

2. 循环体的迭代评估:ForBodyEvaluation

ForBodyEvaluation 是 for 循环的核心迭代逻辑所在。它负责处理循环条件、执行循环体语句以及处理增量表达式,并循环往复,直到条件不再满足。

  1. 逐次迭代环境的创建: 在每次循环迭代开始时(甚至在第一次条件检查之前),引擎会调用 CreatePerIterationEnvironment 抽象操作。这是理解 let 和 const 在 for 循环中“每次迭代都有新变量”行为的关键。

  2. 条件评估: 如果 test 表达式存在(即循环条件,如 i

  3. 循环体执行: 如果条件为 true,引擎会执行 stmt(循环体语句)。

  4. 增量表达式评估: 在循环体执行完毕后,如果 increment 表达式存在(如 i++),引擎会评估它。

这个过程在一个 Repeat 循环中进行,直到 test 条件不满足或遇到 break、continue 等中断指令。

3. 逐次迭代环境的创建:CreatePerIterationEnvironment

CreatePerIterationEnvironment 是 for 循环中 let/const 变量实现“块级作用域”和“每次迭代独立作用域”的关键。它解释了为什么 for (let i = 0; ...) 中的 i 在每次迭代中表现得像一个新变量。

超级简历WonderCV
超级简历WonderCV

免费求职简历模版下载制作,应届生职场人必备简历制作神器

下载

核心机制:

  1. 判断是否存在迭代绑定 (perIterationBindings): 如果 for 循环的初始化部分使用了 let 或 const 声明了变量(这些变量构成 perIterationBindings 列表),则会执行以下步骤:

  2. 获取上一次迭代的环境 (lastIterationEnv): lastIterationEnv 被设置为当前运行执行上下文的 LexicalEnvironment。

    • 对于第一次迭代,lastIterationEnv 就是在 ForLoopEvaluation 中创建的 loopEnv。
    • 对于后续迭代,lastIterationEnv 则是前一次迭代中创建的 thisIterationEnv。
  3. 创建新的迭代环境 (thisIterationEnv): 引擎会创建一个全新的声明式环境记录 thisIterationEnv。

    • 关键点:thisIterationEnv 的外部环境([[OuterEnv]])被设置为 lastIterationEnv 的外部环境 (lastIterationEnv.[[OuterEnv]])。这意味着,每次迭代创建的新环境,其父级环境都是循环外部的那个环境,而不是前一次迭代的环境。这确保了每次迭代的变量绑定是独立的,但它们仍然可以访问循环外部的变量。
  4. 绑定和初始化迭代变量: 对于 perIterationBindings 中的每个变量 bn:

    • 在 thisIterationEnv 中创建一个可变绑定(CreateMutableBinding)。
    • 从 lastIterationEnv 中获取 bn 的当前值(GetBindingValue)。
    • 使用获取到的值来初始化 thisIterationEnv 中的 bn 绑定(InitializeBinding)。
  5. 更新运行执行上下文的词法环境: 最后,当前运行执行上下文的 LexicalEnvironment 被设置为新创建的 thisIterationEnv。

澄清概念:

这里需要强调的是,尽管规范中提到“运行执行上下文的 LexicalEnvironment”,但这不意味着每次迭代都会创建一个新的执行上下文。相反,它指的是在当前运行的执行上下文内部,其 LexicalEnvironment 指针会不断地在不同的词法环境记录之间切换。lastIterationEnv 始终是前一个有效的词法环境,而 thisIterationEnv 是为当前迭代新创建的。这种机制确保了 let 和 const 变量在每次循环迭代中都拥有一个“新鲜”的绑定,即使它们的名称相同。

4. let/const 与 var 在 for 循环中的区别

CreatePerIterationEnvironment 的存在,是 let/const 与 var 在 for 循环中行为差异的根本原因。

使用 let 的示例:

for (let i = 0; i < 3; i++) {
  setTimeout(() => {

相关专题

更多
js获取数组长度的方法
js获取数组长度的方法

在js中,可以利用array对象的length属性来获取数组长度,该属性可设置或返回数组中元素的数目,只需要使用“array.length”语句即可返回表示数组对象的元素个数的数值,也就是长度值。php中文网还提供JavaScript数组的相关下载、相关课程等内容,供大家免费下载使用。

542

2023.06.20

js刷新当前页面
js刷新当前页面

js刷新当前页面的方法:1、reload方法,该方法强迫浏览器刷新当前页面,语法为“location.reload([bForceGet]) ”;2、replace方法,该方法通过指定URL替换当前缓存在历史里(客户端)的项目,因此当使用replace方法之后,不能通过“前进”和“后退”来访问已经被替换的URL,语法为“location.replace(URL) ”。php中文网为大家带来了js刷新当前页面的相关知识、以及相关文章等内容

372

2023.07.04

js四舍五入
js四舍五入

js四舍五入的方法:1、tofixed方法,可把 Number 四舍五入为指定小数位数的数字;2、round() 方法,可把一个数字舍入为最接近的整数。php中文网为大家带来了js四舍五入的相关知识、以及相关文章等内容

727

2023.07.04

js删除节点的方法
js删除节点的方法

js删除节点的方法有:1、removeChild()方法,用于从父节点中移除指定的子节点,它需要两个参数,第一个参数是要删除的子节点,第二个参数是父节点;2、parentNode.removeChild()方法,可以直接通过父节点调用来删除子节点;3、remove()方法,可以直接删除节点,而无需指定父节点;4、innerHTML属性,用于删除节点的内容。

470

2023.09.01

JavaScript转义字符
JavaScript转义字符

JavaScript中的转义字符是反斜杠和引号,可以在字符串中表示特殊字符或改变字符的含义。本专题为大家提供转义字符相关的文章、下载、课程内容,供大家免费下载体验。

392

2023.09.04

js生成随机数的方法
js生成随机数的方法

js生成随机数的方法有:1、使用random函数生成0-1之间的随机数;2、使用random函数和特定范围来生成随机整数;3、使用random函数和round函数生成0-99之间的随机整数;4、使用random函数和其他函数生成更复杂的随机数;5、使用random函数和其他函数生成范围内的随机小数;6、使用random函数和其他函数生成范围内的随机整数或小数。

990

2023.09.04

如何启用JavaScript
如何启用JavaScript

JavaScript启用方法有内联脚本、内部脚本、外部脚本和异步加载。详细介绍:1、内联脚本是将JavaScript代码直接嵌入到HTML标签中;2、内部脚本是将JavaScript代码放置在HTML文件的`<script>`标签中;3、外部脚本是将JavaScript代码放置在一个独立的文件;4、外部脚本是将JavaScript代码放置在一个独立的文件。

654

2023.09.12

Js中Symbol类详解
Js中Symbol类详解

javascript中的Symbol数据类型是一种基本数据类型,用于表示独一无二的值。Symbol的特点:1、独一无二,每个Symbol值都是唯一的,不会与其他任何值相等;2、不可变性,Symbol值一旦创建,就不能修改或者重新赋值;3、隐藏性,Symbol值不会被隐式转换为其他类型;4、无法枚举,Symbol值作为对象的属性名时,默认是不可枚举的。

544

2023.09.20

php源码安装教程大全
php源码安装教程大全

本专题整合了php源码安装教程,阅读专题下面的文章了解更多详细内容。

62

2025.12.31

热门下载

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

精品课程

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

共58课时 | 3.2万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 1.9万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 2.7万人学习

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

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