Js堆内存和栈内存

LXLong
167 阅读7分钟

1. 堆内存

堆是一种经过排序的树形数据结构，每个结点都有一个值。 通常我们所说的堆的数据结构，是指二叉堆。 堆的特点是根结点的值最小（或最大），且根结点的两个子树也是一个堆。 由于堆的这个特性，常用来实现优先队列，堆的存取是随意，这就如同我们在图书馆的书架上取书， 虽然书的摆放是有顺序的，但是我们想取任意一本时不必像栈一样，先取出前面所有的书， 我们只需要关心书的名字。

可以把堆认为是一个很大的内存存储空间，你可以在里面存储任何类型数据。但是这个空间是私有的，操作系统不会管在里面存储了什么，也不会主动的去清理里面的内容，因此在C语言中需要程序员手动进行内存管理，以免出现内存泄漏，进而影响性能。

但是在一些高级语言 如JAVA会有 垃圾回收(GC)  的概念,用于协助程序管理内存空间，自动清理堆中不再使用的数据。

在栈中存储不了的数据比如对象就会被存储在堆中，在栈中呢是保留了对象在堆中的地址，也就是对象的引用。

2. 栈内存

栈是一种特殊的列表，栈内的元素只能通过列表的一端访问，这一端称为栈顶。 栈被称为是一种后入先出（LIFO，last-in-first-out）的数据结构。 由于栈具有后入先出的特点，所以任何不在栈顶的元素都无法访问。 为了得到栈底的元素，必须先拿掉上面的元素。

栈是内存中一块用于存储局部变量和函数参数的线性结构，遵循着先进后出的原则。数据只能顺序的入栈，顺序的出栈。当然，栈只是内存中一片连续区域一种形式化的描述，数据入栈和出栈的操作仅仅是栈指针在内存地址上的上下移动而已。

需要注意的是：内存中栈区的数据，在函数调用结束后，就会自动的出栈，不需要程序进行操作，操作系统会自动回收，也就是：栈中的变量在函数调用结束后，就会消失。

3. 基本类型、引用类型与堆内存、栈内存的关系

JavaScript中的变量分为基本类型和引用类型

  • 基本数据类型共有6种
  1. Sting
  2. Number
  3. Boolean
  4. null
  5. undefined
  6. Symbol
  • 基本类型是保存在栈内存中的简单数据段，它们的值都有固定的大小(个人认为，这也是为什么null作为一个object类型的变量却存储在栈内存中的原因。)，保存在栈空间，通过按值访问，属于被频繁使用的数据。
  • PS: 需要注意的是闭包中的基本数据类型变量不保存在栈内存中，而是保存在堆内存中。
  • Array,Function,Object...可以认为除了上文提到的基本数据类型以外，所有类型都是引用数据类型。
  • 引用类型是保存在堆内存中的对象，值大小不固定，栈内存中存放的该对象的访问地址指向堆内存中的对象，JavaScript不允许直接访问堆内存中的位置，因此操作对象时，实际操作对象的引用
let a1 = 0; // 栈内存
let a2 = "this is string" // 栈内存
let a3 = null; // 栈内存
let b = { x: 10 }; // 变量b存在于栈中，{ x: 10 }作为对象存在于堆中
let c = [1, 2, 3]; // 变量c存在于栈中，[1, 2, 3]作为对象存在于堆中

image.png 因此当我们要访问堆内存中的引用数据类型时，实际上我们首先是从变量中获取了该对象的地址指针， 然后再从堆内存中取得我们需要的数据。

有一个十分很容易忽略的点，使用new关键字初始化的之后是不存储在栈内存中的。为什么呢？new大家都知道，根据构造函数生成新实例，这个时候生成的是对象，而不是基本类型。 image.png

再看一个例子 image.png 很明显，如果a，b是存储在栈内存中的话，两者应该是明显相等的，就像null === null是true一样，但结果两者并不相等，说明两者都是存储在堆内存中的，指针指向不一致。

说到这里，再去想一想我们常说的值类型和引用类型其实说的就是栈内存变量和堆内存变量，再想想值传递和引用传递、深拷贝和浅拷贝，都是围绕堆栈内存展开的，一个是处理值，一个是处理指针。

4. 从内存角度来看变量复制

① 基本数据类型的复制

在栈内存中的数据发生复制行为时，系统会自动为新的变量分配一个新值，最后这些变量都是相互独立互不影响的

let a = 20;
let b = a;
b = 30;
console.log(a); // 此时a的值是20

在这个例子中，a、b 都是基本类型，它们的值是存储在栈内存中的，a、b 分别有各自独立的栈空间， 所以修改了 b 的值以后，a 的值并不会发生变化。

image.png ② 引用数据类型的复制

  • 引用类型的复制，同样为新的变量b分配一个新的值，保存在栈内存中，不同的是，这个值仅仅是引用类型的一个地址指针
  • 他们两个指向同一个值，也就是地址指针相同，在堆内存中访问到的具体对象实际上是同一个
let a = { x: 10, y: 20 }
let b = a;
b.x = 5;
console.log(a.x); // 5

因此改变b.x时，a.x也发生了变化，这就是引用类型的特性 ，结合下图理解 image.png

5. const机制

const 为 ES6 新出的变量声明的一种方式，被 const 修饰的变量不能改变。其实对应到 JavaScript 的变量储存图中，就是变量所指向的内存地址不能发生变化。也就是那个箭头不能有改变。

当我们定义一个const对象的时候，我们说的常量其实是指针，就是const对象对应的堆内存指向是不变的，但是堆内存中的数据本身的大小或者属性是可变的。而对于const定义的基础变量而言，这个值就相当于const对象的指针，是不可变。

知道了const在内存中的存储，那么const、let定义的变量不能二次定义的流程也就比较容易猜出来了，每次使用const或者let去初始化一个变量的时候，会首先遍历当前的内存栈，看看有没有重名变量，有的话就返回错误。

6. 栈内存和堆内存的垃圾回收

一般来说栈内存线性有序存储，容量小，系统分配效率高。而堆内存首先要在堆内存新分配存储区域，之后又要把指针存储到栈内存中，效率相对就要低一些了。

垃圾回收方面，栈内存变量基本上用完就回收了，而推内存中的变量因为存在很多不确定的引用，只有当所有调用的变量全部销毁之后才能回收。 栈内存中变量一般在它的当前执行环境结束就会被销毁被垃圾回收制回收， 而堆内存中的变量则不会，因为不确定其他的地方是不是还有一些对它的引用。 堆内存中的变量只有在所有对它的引用都结束的时候才会被回收。

avatar
文章
阅读
粉丝