17. JS中的堆与栈

数据类型分为简单类型与复杂类型，简单类型也叫 基本数据类型 或 值类型，复杂类型也叫引用类型

简单数据类型包括 string,number,boolean,undefined,null。我们将这五种变量给typeof，除了null会返回object(这个实际上是设计之初遗留下来的bug，后来就将错就错了)，其余都会返回本身的类型名称

复杂数据类型除了上面的那5个，剩下的都是复杂数据类型，如Object,Array,Date等，它们一般使用new创建对象

目录

1  概念

2  数据的传递

2.1  简单数据类型传参

2.2  复杂数据类型传参

---

1  概念

在JS中没有堆与栈的概念，我们通过堆与栈更好理解变量是如何存储的

堆与栈都是内存中的一部分空间，栈存放的是简单数据类型，堆存放的是复杂数据类型。

当我们现在定义一个简单变量age=18，那么在栈中就会存一个18的值，每当使用age这个变量的时候会指向18这个值

现在我们定义一个复杂变量arr = [1,2,3]，这是堆中会存储[1,2,3]，并且在栈中会生成一个指向堆的地址（比如0x1F78D，系统会自动分配一个地址），每当我们使用变量arr时，都会从栈中找到地址，从而使用[1,2,3]

2  数据的传递

2.1  简单数据类型传参

当我们要修改age的时候，比如我们现在让 age = 20，这是20会将18覆盖掉，不会占据额外的栈空间。如果要修改的变量是一个字符串，它会重新存储新字符串，然后改变指向，会占据额外的栈空间

我们下面看一下这一个函数的变量传递方式

注意这里要对传入的变量进行操作，这里如果改成对a进行赋值这个例子就没有意义了

第一句执行的是var x = 10

第二步开始执行函数，我们将x这个变量的值赋值给了a，注意此时x与a并不是公用一个变量值，而是分开的

之后a自加，然后输出a，最后输出x

由于上面的代码占用了两个栈的空间，所以最后输出的结果a是11，x是10

2.2  复杂数据类型传参

我们看下面这个参数，同样是对传入的变量进行操作

由于是复杂变量，所以栈中是地址，堆中是值

首先执行 var p = new Person('林登万')

然后开始执行函数 f1，此时引入了x指向一个新的地址，但地址的值是一样的，所以一开始的x.name还是林登万

之后执行 x.name = '李大炮'，此时会改变堆中的值

改变堆的值之后，无论是p.name还是x.name都是李大炮，我们看一下运行结果

我们再用数组看一下

效果是一样的