JavaScript 内存空间布局

JavaScript 内存空间图解：揭秘执行环境的幕后故事

在 JavaScript 执行过程中，内存空间发挥着至关重要的作用。它是存放代码和数据信息的容器，包括各种数据结构和执行上下文。理解 JavaScript 内存空间的布局对于深入了解 JavaScript 的运行机制至关重要。

JavaScript 内存空间主要分为以下几部分：

• 栈（Call Stack）： 用于存储执行上下文，包括函数调用顺序、局部变量和参数。
• 堆（Heap）： 用于存储对象和数组等动态分配的数据，在运行时动态扩展。
• 代码空间： 存储 JavaScript 代码本身，包括函数定义、变量声明等。
• 全局执行上下文： 包含全局变量和函数，在脚本加载时创建。

栈是一个先进后出的数据结构。当函数被调用时，一个新的执行上下文会被压入栈中。这个执行上下文包含了函数的参数、局部变量和对其他执行上下文的引用。当函数执行完毕后，它将从栈中弹出，释放其占用的内存空间。

堆是一个动态扩展的数据结构，用于存储动态分配的对象和数组。当一个对象或数组被创建时，它的内存空间将在堆中分配。堆中的数据可以用指针来访问，这些指针存储在栈中。

代码空间存储着 JavaScript 脚本的实际代码，包括函数定义、变量声明和语句。它在脚本加载时被解析并存储在内存中。代码空间是不可变的，不能在运行时进行修改。

全局执行上下文在脚本加载时创建。它包含了全局变量和函数，这些变量和函数可以在脚本的任何地方访问。它也是所有其他执行上下文的父上下文。

考虑以下代码片段：

function add(a, b) {
  var c = a + b;
  return c;
}

var result = add(1, 2);

当此代码执行时，会发生以下内存空间分配：

• 全局执行上下文创建，存储全局变量 result。
• 当 add 函数被调用时，一个新的执行上下文被压入栈中，存储局部变量 a、b 和 c。
• 变量 a、b 和 c 在堆中分配内存空间。
• add 函数执行完毕后，其执行上下文从栈中弹出，释放其占用的内存空间。
• 结果值 3 存储在全局变量 result 中。