菜鸡前端回复《友好"挑战"掘金全体前端》

写在前面

最近偶然逛掘金,看到了一篇讨论特别火的文章,主要问题以下前端

var a = {n: 1};

var b = a;  

a.x = a = {n: 2};

console.log(a);
console.log(a.x)
console.log(b);
console.log(b.x);
复制代码

输出的结果是什么?程序员

相信知道结果的人不在少数,可是做为一个菜鸡前端开发来讲,只是想作的或者说应该作的是在本身知识基础上尝试性的解释下这个问题,其余的并不敢妄断。若有解释不对的地方,但愿各位指出,帮助我更加深刻的理解面试

昨天跟公司的大佬也face to face交换了一下思路,发现本身要学的还真是特多的。bash

正文

首先说一下,我在工做中没有见到过这种写法(固然不排除,个人层次不足)。spa

程序员所生产的代码是给人看给机器执行的,这种写法有点反人类,并非那么容易维护,review的时候很痛苦,想在几百上千行中注意到这样的语句仍是比较麻烦的。3d

在个人理解中这个更像一个考题,来考察面试者的知识点。那既然说到了知识点,咱们言归正传好了,来讲说这个题目。code

JS中基础类型和引用类型

下面来讲说这两种类型的存储cdn

栈内存(stack)
var a = 1 
复制代码

基础数据类型存储在栈内存中对象

如上,定义一个变量a,系统自动分配存储空间(栈内存)。按值访问,所以咱们能够直接操做保存在栈内存中的值。blog

堆内存(heap)
var a = { n : 1 }
复制代码

须要明确的是引用数据类型的值存储在堆内存中。上面咱们生成的变量a 其实保存在栈中, a的值就是指向堆中{n:1}的内存地址

有了这些基础咱们把问题拆解开:

第一部分

var a = {n: 1};
var b = a;  
复制代码

忽略难看的因素

其实是将栈中a存储的堆内存地址赋值给了b。

第二部分

a.x = a = {n: 2};
复制代码

这部分须要注意的是优先级

'.'的优先级大于赋值,因此最早执行的是a.x,再执行赋值操做,赋值操做是右结合的,因此以下:

最早执行的a.x能够看作是 a.x = undefined;

而后进行赋值操做, 可是须要注意,由于先执行的a.x = undefined;,a.x中的a已是对堆中对象{n:1,x:undefined}的引用

a={n:2}
复制代码

将栈中保存的a变量指向新的引用类型

忽略难看手稿

而后是

a.x = a;
复制代码

前面已经说过了,因为优先级的缘由a.x中的a已经完成了对堆内存中对象的引用,指向的是{n:1,x:undefined}(地址是0x6789),并非更改以后a的值(0x8889), 赋值操做能够变形为 b.x = a;

因此输出结果

写在最后

文章有粗陋浅薄之处,请各位大神斧正

我以为提出疑问你们谈论没太大的问题,毕竟掘金是你们交流的地方,也有不少优秀大佬愿意帮助别人。

更重要的应该是关注问题的自己和问题背后隐藏的问题,提升本身、帮助他人。不要太在乎其余东西,有些东西本身明白就行了,永远没法叫醒一个装睡的人,不是吗?

掘金会越办越好的,风气也会愈来愈好。你们加油

相关文章
相关标签/搜索