详解JavaScript栈内存与堆内存

在JavaScript中，内存分为栈内存和堆内存两种类型。栈内存用于存储基本数据类型和引用类型的变量的值，而堆内存用于存储复杂对象和引用类型的实例。

栈内存

栈内存是一种后进先出（LIFO）的数据结构，它用于存储函数的执行上下文和基本数据类型的值。每当一个函数被调用时，都会创建一个新的执行上下文，并将其推入栈内存中。当函数执行完毕后，其执行上下文会被弹出栈内存。

栈内存中存储的数据大小是固定的，因此它的分配和释放速度非常快。栈内存中存储的数据包括函数的参数、局部变量和返回值。

下面是一个示例，演示了栈内存的使用：

function add(a, b) {
  let sum = a + b;
  return sum;
}

let result = add(3, 5);
console.log(result);

在这个示例中，当add函数被调用时，会创建一个新的执行上下文，并将其推入栈内存中。在执行上下文中，a和b被分配了内存空间，并且在函数执行完毕后，执行上下文会被弹出栈内存。

堆内存

堆内存用于存储复杂对象和引用类型的实例。与栈内存不同，堆内存的大小不固定，它的分配和释放速度较慢。

在堆内存中存储的数据是通过引用访问的，而不是直接访问。当我们创建一个对象或者实例化一个类时，它们会被存储在堆内存中，并返回一个引用。这个引用可以被赋值给变量，以便在代码中使用。

下面是一个示例，演示了堆内存的使用：

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
}

let person1 = new Person(\"Alice\", 25);
let person2 = person1;

person2.name = \"Bob\";

console.log(person1.name); // 输出 \"Bob\"
console.log(person2.name); // 输出 \"Bob\"

在这个示例中，我们创建了一个Person类的实例person1，并将其赋值给person2。由于对象是通过引用访问的，所以person1和person2实际上指向了同一个对象。当我们修改person2的name属性时，person1的name属性也会被修改，因为它们引用的是同一个对象。

总结起来，栈内存用于存储基本数据类型和引用类型的变量的值，而堆内存用于存储复杂对象和引用类型的实例。了解栈内存和堆内存的区别对于理解JavaScript中的内存管理非常重要。