JS連續賦值與求值順序

標籤：define   問題   第一個   style   code   執行順序   bsp   變數   執行   

以下代碼輸出什麼? 為什麼?

var a = {n:1}; var b = a;  a = {n:2}; a.x = a ;console.log(a.x);console.log(b.x);

var a = {n: 1}var b = a;a.x = a = {n: 2};console.log(a.x);console.log(b.x)

 

 

　　第一個問題：

a.x ---> {n:2,x:a};b.x ---> undefined;

解答：a的值很清晰了，a第二次賦值以後變成了{n:2}，隨後添加了x屬性指向自身。而對於b，在a第二次賦值以後，由於js中給變數賦值為object類型時，變數中儲存的是對這個object的引用。
此時，a指向{n:2} ，而b指向了{n:1} ，a和b指向不同的對象，因此，在a上添加屬性對於b無影響，b.x自然就是undefined。

　　第二個問題：

　　解答：第三句裡的主要痛點在js運算子的優先順序，訪問屬性、調用方法運算子"."的優先順序高於賦值運算子。因此執行順序是

1. 給a添加屬性x，此時a,b都是 { n:1,x:undefined },a.x 運算後的結果即為這個object（可以說也就是b）的x屬性值。
2. 把{n:2}賦值給a，此時a是 {n:2},是一個新的對象。 b是{ n:1,x:undefined }。

   由於（ .  運算子最先計算）一開始js已經先計算了a.x，便已經解析了這個a.x是對象A的x，所以在同一條公式的情況下再回來給a.x賦值，也不會說重新解析這個a.x為對象B的x。

   所以 a.x=a 應理解為對象A的屬性x指向了對象B:

   （這個時候a.x 已經運算完了，不會再與a產生任何關係，a.x依舊代表那個n為1對象的x屬性值，和a已經沒關係了。）
3. 把{n:2}賦值給a.x 也就是 { n:1,x:undefined }這個對象的x屬性，這個時候b依舊指向這個object，因此此時，a是{n:2}，b是{n:1,x:{n:2}}

JS連續賦值與求值順序