一道面試題引發(fā)的血案

@specialCoder 回答的很詳細(xì)。這個(gè)問題牽涉到預(yù)算符的優(yōu)先級和字面量對象賦值注意事項(xiàng)。平時(shí)多總結(jié)，多思考這樣的面試問題就不是問題。

https://segmentfault.com/a/11... 我覺得這篇文章解釋的很清楚

你搜js連續(xù)賦值，一堆一堆的。

找到了一篇更全面的問答：https://www.cnblogs.com/moron...
內(nèi)容如下：
以下代碼輸出什么? 為什么?
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)

　　第一個(gè)問題：

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

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

第二個(gè)問題：
　　解答：第三句里的主要難點(diǎn)在js運(yùn)算符的優(yōu)先級，訪問屬性、調(diào)用方法運(yùn)算符"."的優(yōu)先級高于賦值運(yùn)算符。因此執(zhí)行順序是

給a添加屬性x，此時(shí)a,b都是 { n:1,x:undefined },a.x 運(yùn)算后的結(jié)果即為這個(gè)object（可以說也就是b）的x屬性值。
把{n:2}賦值給a，此時(shí)a是 {n:2},是一個(gè)新的對象。 b是{ n:1,x:undefined }。
由于（ . 運(yùn)算符最先計(jì)算）一開始js已經(jīng)先計(jì)算了a.x，便已經(jīng)解析了這個(gè)a.x是對象A的x，所以在同一條公式的情況下再回來給a.x賦值，也不會說重新解析這個(gè)a.x為對象B的x。

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

（這個(gè)時(shí)候a.x 已經(jīng)運(yùn)算完了，不會再與a產(chǎn)生任何關(guān)系，a.x依舊代表那個(gè)n為1對象的x屬性值，和a已經(jīng)沒關(guān)系了。）
把{n:2}賦值給a.x 也就是 { n:1,x:undefined }這個(gè)對象的x屬性，這個(gè)時(shí)候b依舊指向這個(gè)object，因此此時(shí)，a是{n:2}，b是{n:1,x:{n:2}}

var foo = {n: 1};//A
var bar = foo;//B
foo.x = foo = {n: 2};//C

foo.x//undefined

A.執(zhí)行后，生成對象 OBJ_A',變量foo指向它
B.執(zhí)行后，bar和foo指向了同一個(gè)對象 OBJ_A‘
C.賦值語句，請從左向右執(zhí)行賦值操作符涉及的每一個(gè)表達(dá)式求值

foo.x foo 指向 OBJ_A‘, foo.x為undefined bar指向 OBJ_A‘
foo 指向 OBJ_A‘
{n: 2} 生成對象OBJ_B'
從右向左執(zhí)行賦值,每一個(gè)左邊表達(dá)式不會重復(fù)求值

1 foo = {n: 2} foo變量現(xiàn)在指向OBJ_B',返回為OBJ_B'
2 foo.x = OBJ_B',對foo指向的對象的屬性x賦值，如果當(dāng)前沒有這個(gè)屬性那就新建然后賦值，否則直接賦值。
注意此時(shí)的foo指向的還是 OBJ_A‘，這個(gè)是在表達(dá)式求值極端就確定的，也就是對OBJ_A‘的屬性x賦值，
3.最終

foo=>{n: 2}
bar=>{
    n:1,
    x:foo
}

其實(shí)上面的代碼和下面的相同

var foo = {n: 1};//A
var bar = foo;//B
bar.x = foo = {n: 2};//C
foo.x//undefined

關(guān)于
左向右執(zhí)行賦值操作符涉及的每一個(gè)表達(dá)式求值
和
從右向左執(zhí)行賦值 請看下面的代碼

var p={};
(function(){
    Object.defineProperty(p, 'z',{
        set:function(newValue){
            console.log("set Z");
            this.value=newValue;
        },
        get:function(){
            return this.value
        }
    });
    console.log("1")
    return p;
}()).z=(function(){
    var q={};
    Object.defineProperty(q, 'y',{
        set:function(newValue){
            console.log("set Y");
            this.value=newValue;
        },
        get:function(){
            return this.value
        }
    });
    console.log("2")
    return q;
}()).y="3";

輸出
1
2
set Y
set Z