‘=‘引发的血案，张三的失败人生罢了

 因为最近可能有比较多的面试，在看面试题的时候看到了一道题，我自认为很简单，于是我上手了，结果就是这篇文章，题目如下：

let n = [10,20]
let m = n;
let x = m;
m[0] = 100;
x = [30,40];
m = x;
x[0] = 200;
m[1] = 300;
n[2] = 400;
console.log(n,m,x)

我最开始得出的结果是：

[200,300,400],[200,300,400],[200,300,400]

不会有很多人跟我一样吧...

上述答案是错的，正确答案是：

 

可以说是很受打击了，简单的赋值打印都没办法作对，面试要怎么搞？

于是我去了解了JS的堆栈内存，总结如下：

首先，浏览器想要执行JS代码，大致分为三个步骤：

1.从电脑中分配出一个栈内存(Stack)用来执行代码和存储变量、基本类型值。

2.如果值为引用类型值，那么，电脑会分配出堆内存，用来存放引用类型值。

3.分配一个主线程用来自上而下执行代码。

按照这个思路再来解这道题，就能较为轻松的得到这个答案（单看文字太无聊，下面有图供参考）

let n = [10,20]

首先，我把栈比喻为酒店，变量比喻为张三，值比喻为张三的行李箱。

第一步，张三（男）入住酒店，并且酒店给张三安排了房间，让张三入住。(创建变量n，将n放到当前的栈内存变量存储空间)

第二步，将张三的行李箱，放到酒店安排的行李存储柜中，但是酒店的存储柜只能存放上衣，这个行李箱经过扫描发现里面的行李还有裤子和鞋子，因此，酒店把行李箱放到了另外的位置，并且把行李箱的地址放在了张三原本的行李存储柜中。（创建一个引用类型值 [10,20] 把它存储到当前的栈内存值存储空间，此时浏览器判断，值不是基本数据类型值，因此电脑分配了一个堆内存用来存储该引用类型值，并且将地址放到了值存储空间中）

第三步，将行李存储柜的钥匙（‘=’）交给张三 (‘=’ 号，其实等号并不是赋值，而是将变量与值关联起来）

第一行到此结束，看第二行：

let m = n;

 这时候，李四（女）来了，他告诉酒店，他的行李和张三的放在一起，酒店明白了，因此把张三的行李存储柜钥匙也交给了李四，所以李四也能根据存储柜中留下的地址，找到自己的行李。（让m 与 n 在值存储空间中的地址关联，此时，m === n）

let x = m;

过了一会儿，王五（男）也到酒店了，王五告诉酒店，我的行李和李四的放在一起，酒店表示小场面，早有准备，于是把存储柜的钥匙也交给了王五，所以王五也能根据存储柜的地址找到自己的行李。（让 n,m,x 在值存储空间中的地址关联，此时，n === m === x） 第三行结束。

第四行:

m[0] = 100;

李四告诉酒店，找到附近最好的裁缝店，把行李箱里第一件衣服加工到价值有100块钱，酒店顺着行李柜的地址去找到李四的第一件衣服，并对衣服进行了加工，成功升值为100。（栈内存先判断变量存储空间中该变量对应的值 m[0] 是否存在，若存在，那么将该值变为100，此时 n,m,x的值为 [100,20]） 第四行结束。

第五行：

x = [30,40];

王五知道衣服被李四改动后不满意，因此王五决定自己买个行李箱放衣服，里面也有裤子，所以酒店安排了另外一个地址给王五放行李，与第一行类似。（栈内存中，变量存储空间里的x，与新建的值存储空间中的地址建立关联，需要注意的是，‘=’号并不是赋值，而是关联！！此处可以解读为变量x 关联了数组 [30,40] ，因此变量可以通过关联来达到展现的效果，此时 n,m的值为[100,20]，x的值为 [30,40] ） 第五行结束。

第六行：

m = x;

李四看到王五这么有男人味，居然不妥协自己，就是喜欢这种有脾气的男人，于是跟王五在一起了。（m关联x，此时x关联的地址指向的值是[30,40] ，而m关联了x 所以m的值也是 [30,40] ，n的值 [100,20] ） 第六行结束。

第七、八行：

x[0] = 200;
m[1] = 300;

李四和王五商量，要把衣服给裁缝店加工得更精致一点，于是一人出了一个主意，王五对酒店说，把我的第一件行李加工成升值成200块钱的，李四补充道，把第二件行李加工升值成300块钱的，酒店按照两人的说明找到了对应的衣服，于是把这两件衣服加工成了200块钱的和300块钱的。（栈内存判断x[0],m[1]是否存在，若存在，那么分别将这他们的值变为相对应的值，此时，x和m关联的仍为同一个地址，并没有创建新的堆内存或者新的值，因此，此时的x和m的值为 [200,300]） 第七、八行结束。

第九行

n[2] = 400;

张三看到他们俩唧唧我我，原本属于自己的成功人生被王五毁于一旦，张三不服气，表示自己绝对不能比他们两个过的差，于是吩咐酒店，把他的第三件衣服升值到400，不然就投诉酒店！酒店收到指令后一看，发现张三并没有第三件衣服，但是为了自己不被投诉，于是酒店自己掏钱替张三买了一双NIke Jordan Access，黑红色，双十一打折399外加邮费险1块钱刚好400，张三看到后并不高兴，毕竟自己最终也只是赢了面子，但是输的还是那么彻底（栈内存判断n[2]是否存在，不存在， 所以向堆内存中添加了新的值，并让n[2]与其关联，最后得出n的值为[100,20,400] ）

 第十行：

console.log(n,m,x)

打印结果为：

 

标签：罢了,酒店,行李,血案,张三,李四,内存,王五,100
来源： https://blog.csdn.net/No_Bug_Please/article/details/121021481