连续赋值(从堆栈角度解析) a.x = a = {n:2}

34次阅读

共计 627 个字符,预计需要花费 2 分钟才能阅读完成。

连续赋值
今天看到一个面试题,一直想把这个题目解析更加直观化,就跟看小人书一样,看图就能明白其中的原理,所以用 PPT 做了几张图。
var a = {n: 1}
var b = a;
a.x = a = {n: 2}
console.log(a.x);
console.log(b.x)
这块最难理解的就是这块
a.x = a = {n: 2}
接下来我们从以下几点分析以下:

运算符优先级;
` 我们知道运算符的优先级决定了表达式中运算执行的先后顺序,优先级高的运算符最先被执行。`
赋值运算顺序是从右往左的,不过由于“.”是优先级最高的运算符,所以这行代码先“计算”了 a.x;

优先级
运算类型
关联性
运算符

19
成员访问
从左到右
… . …

3
赋值
从右到左
… = …

链接: 运算符优先级

堆栈图来看怎么赋值操作的;
var a={n:1}; a 指向了堆内存中的对象 {n:1}, var b=a; a 赋予给 b 的时候传的是栈中的地址(相当于新建了一个不同名“指针”),而不是堆内存中的对象。

a.x = a = {n: 2} ; 前面说了“.”的优先级大于赋值运算符的优先级,所以先来看 a.x;a.x 实际上是未定义的;

再来看赋值运算符的从右向左解析;a = {n : 2},a 被从新赋值,指向了一个新对象,而此时 a.x 已经先行执行完,其实指是 {n:1,x: undefined} 这个对象,接下来看左边的等号,这个对象的 x 值 = 等号右边计算的结果(a={n:2},所以此时 b 的值通过箭头可以看出等于 {n:1,x:{n:2}},a 的值指向新对象 {n:2}

以上如有出入,请多指正~~~

正文完
 0