每天一道面试题--(搞懂js堆栈空间)

题目:

var a = {n: 1};
var b = a;
a.x = a = {n: 2};

console.log(a.x)  
console.log(b.x)

请问打印出来的是什么???

• 这个其实需要对js堆栈空间及执行顺序要有了解,否则结果就出乎意料了

答案:

解析:

• 第一步,var变量提升,在栈中生命两个变量a,b,地址分别为1x0001和1x0002
• 第二步,在堆中开辟空间1,存储对象{n:1},赋值给变量a,a的指针指向空间1
• 然后b引用了a,就是b的指针也指向了空间1
• 关键来了,第三行,我们一般认为执行顺序是从右往左去执行
• 但是这里对对象属性的操作是优先于复制操作的,也就是说要先执行a.x,然后再继续从右往左执行
• 那么就是先在堆空间1中声明属性x,此时x的值为undefined
• 然后执行{n:2},就是在堆中开辟空间2{n:2},然后赋值给a,a的指针指向空间2
• 最为重要的一步来了
• a.x = a 这个时候要分清楚两个变量的指针是不一样的
• a.x的指针是指向空间1,可以理解a.x就是b.x,而a的指针是指向空间2的
• 此时赋值,就是空间1的属性x赋值为空间2的值{n:2}
• 所以空间1里的值是{n:1,x:{n:2}},空间2的值{n:2}
• a的指针指向空间2,b的指针指向空间1
• 所以打印出来的结果如上所述

难点:

1. 如果不知道a.x的执行优先级优先于复制语句的话,也难以解决这个问题
2. 如果不理解堆栈及指针引用,那么在最后a.x=a的这个过程是难以理解的