拒绝玄学，看透本质：图解 JavaScript 词法环境与内存引用
很多同学在学习闭包时，往往只记住了“子函数可以使用父函数的变量”这个结论，却对底层的**“词法环境（Lexical Environment）”**知之甚少。
本文将剥离所有晦涩的术语堆砌，通过一段经典代码，深入内存底层，向你展示**代码逻辑（Code）、变量数据（Data）和执行环境（Environment）**在运行时的真实物理关系。
案例代码
我们以这段经典的闭包代码为例：
JavaScript
// 全局环境 let a = 100 function fun() { let timer = 0 // 局部变量 // 定义内部函数 function test() { timer++ console.log(timer) } return test } // 核心时刻：函数执行，并返回内部函数 const myTest = fun()第一部分：直觉的误区（为什么你会困惑？）
初学者最容易犯的错误，是认为内存结构等同于代码结构。
错误的静态视角：
“因为代码里 test 嵌套在 fun 里，所以内存里 test 的数据也死死地包在 fun 里。fun 执行完，这块空间就该销毁，或者一直死板地存在那里。”
这种“俄罗斯套娃”式的直觉（如下图），无法解释为什么fun执行完了，timer还能被访问，也无法解释什么是“动态的作用域链”。
Code snippet
第二部分：揭秘真相——什么是“词法环境”？
要理解闭包，必须先理解 JavaScript 引擎执行代码时的分离存储原则。
在 JavaScript 运行时，“代码逻辑”和“状态数据”是分开存放的，靠“引用（指针）”连接。而管理这些状态数据的核心结构，就叫词法环境（Lexical Environment）。
1. 核心概念定义
一个标准的词法环境由两部分组成：
环境记录器（Environment Record）：这就是一个“登记表”，专门用来存放变量和函数的声明。比如
timer = 0就记在这里。外部环境引用（Outer Reference）：这是一个“指针”，指向父级的词法环境。这就是作用域链的物理实体。
2. 运行时拆解：变量、函数、代码究竟在哪？
当执行const myTest = fun()这行代码时，内存中发生了极其精密的动态构建过程。
请配合下方的高维内存模型图来阅读：
变量存在哪？（数据）
当 fun() 被调用时，引擎在内存中创建了一个全新的词法环境（Lexical Environment）。变量 timer 的值 0 被保存在这个环境的环境记录器中。
代码存在哪？（逻辑）
函数 test 的代码逻辑（即函数体内的字符串）并不存储在词法环境里，而是存储在堆内存（Heap） 中一个独立的函数对象（Function Object）里。
它们如何相互引用？（关键！）
这是最关键的一步。当 test 函数对象被创建时，引擎会给它装上一个不可见的内部属性 [[Environment]]。这个属性直接指向了 fun 执行时创建的那个词法环境。
第三部分：一张图看懂内存物理结构
下面的 Mermaid 图解展示了fun()执行瞬间的真实内存快照。请重点关注代码存储（Heap）与环境记录（Stack/Context）的分离与连接。
Code snippet
第四部分：总结与顿悟
通过上图，我们可以回答最初的困惑：
为什么 fun 执行完，timer 不消失？
看图中的红色粗线。虽然 fun 函数执行结束了，但返回的 test 函数对象里有一个 [[Environment]] 指针，死死地拉住了 fun 的词法环境。只要 myTest 还在引用 test 对象，这个Fun LE方块就永远无法被垃圾回收。
代码和环境是如何分离的？
test 的代码逻辑静静地躺在堆内存里（右边），而它所需要操作的数据 timer 躺在动态生成的词法环境里（左边）。两者通过指针跨越内存区域相连。
所谓闭包，本质上就是：一个函数对象（代码）保留了对它出生地（词法环境）的引用。
理解了这一点，你就理解了 JavaScript 内存模型的核心。
