正文
(转)深入理解javascript连续赋值表达式
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
引入
今天逛园子的时候看到一道javascript面试题，是关于连续赋值的，正好最近读jQuery源码经常看到这种连续赋值的表达式，所以很感兴趣。
废话不多说，来看题：
var a = {n: 1}
var b = a;
a.x = a = {n: 2}
console.log(a.x);
console.log(b.x)
答案：
console.log(a.x); // undefined
console.log(b.x) //{n:2}
看到这个答案，我真是百思不得解。。。。 于是网上搜了搜，整理如下：
以下转自：http://www.iteye.com/topic/785445
1、引用(Reference)与GetValue & PutValue
引用
A Reference is a reference to a property of an object. A Reference consists of two components, the base object and the property name.
“引用”是引用某个对象的一个属性（可能这个对象并没有这个属性），一个引用含“根对象”与“属性名”两个成员。
后面以“(根对象,属性名)”来表达一个引用
引用
GetValue (V)
1. If Type(V) is not Reference, return V.
2. Call GetBase(V).
3. If Result(2) is null, throw a ReferenceError exception.
4. Call the [[Get]] method of Result(2), passing GetPropertyName(V) for the property name.
5. Return Result(4).
1. If Type(V) is not Reference, return V.
2. Call GetBase(V).
3. If Result(2) is null, throw a ReferenceError exception.
4. Call the [[Get]] method of Result(2), passing GetPropertyName(V) for the property name.
5. Return Result(4).
GetValue，即取值操作，返回的是确定的值，而不是引用。（可以理解为变量与变量的值，或指针与指针指向的对象）
引用
PutValue (V, W)
1. If Type(V) is not Reference, throw a ReferenceError exception.
2. Call GetBase(V).
3. If Result(2) is null, go to step 6.
4. Call the [[Put]] method of Result(2), passing GetPropertyName(V) for the property name and W for the value.
5. Return.
6. Call the [[Put]] method for the global object, passing GetPropertyName(V) for the property name and W for the
value.
7. Return.
1. If Type(V) is not Reference, throw a ReferenceError exception.
2. Call GetBase(V).
3. If Result(2) is null, go to step 6.
4. Call the [[Put]] method of Result(2), passing GetPropertyName(V) for the property name and W for the value.
5. Return.
6. Call the [[Put]] method for the global object, passing GetPropertyName(V) for the property name and W for the
value.
7. Return.
PutValue操作只对引用生效，在ECMAScript的描述中，修改对象的属性都是通过Refrence + PutValue进行的
（ECMAScript是为了便于表达而引入Reference这个类型，实际上JS语言中并无此类型。The internal Reference type is not a language data type. It is defined by this specification purely for expository
purposes.）
2、成员表达式(MemberExpression)解释过程
引用
The production MemberExpression : MemberExpression [ Expression ] is evaluated as follows:
1. Evaluate MemberExpression.
53
2. Call GetValue(Result(1)).
3. Evaluate Expression.
4. Call GetValue(Result(3)).
5. Call ToObject(Result(2)).
6. Call ToString(Result(4)).
7. Return a value of type Reference whose base object is Result(5) and whose property name is Result(6).
1. Evaluate MemberExpression.
53
2. Call GetValue(Result(1)).
3. Evaluate Expression.
4. Call GetValue(Result(3)).
5. Call ToObject(Result(2)).
6. Call ToString(Result(4)).
7. Return a value of type Reference whose base object is Result(5) and whose property name is Result(6).
着重看第7步：a value of type Reference
3、赋值表达式解析
引用
The production AssignmentExpression : LeftHandSideExpression = AssignmentExpression is evaluated as follows:
1. Evaluate LeftHandSideExpression.
2. Evaluate AssignmentExpression.
3. Call GetValue(Result(2)).
4. Call PutValue(Result(1), Result(3)).
5. Return Result(3).
1. Evaluate LeftHandSideExpression.
2. Evaluate AssignmentExpression.
3. Call GetValue(Result(2)).
4. Call PutValue(Result(1), Result(3)).
5. Return Result(3).
这里可以看到左侧得出的是引用，右侧调用GetValue取得的是确定值。
那么开始分析a.b = a = {n:2}这个表达式，先假设{n:1}这个对象为OBJ1，{n:2}为OBJ2，全局为GLOBAL。
它的解析如下：
a.b = Expression1
Expression1为另一个赋值表达式：
a = {}
首先计算a.b = Expression1，按(3)中赋值表达式运行步骤
step1先得到引用(OBJ1, "b")
step2解析Expression1{
Expression1解析
step1得到引用(GLOBAL, "a")
step2得到一个对象OBJ2
step3取值，仍是OBJ2
step4将引用(GLOBAL, "a")赋值为step3结果
step5返回OBJ2
}
step3取值，结果同样为OBJ2
step4将(OBJ1, "b")赋值为OBJ2
step5返回OBJ2
最终结果：
OBJ1: {n:1, b:OBJ2}
OBJ2: {n:2}
a : OBJ2
PS:
我们常说赋值运算是从右至左，是指右边先结合
所以a.b = a = {n:2}解析为了a.b = ( a = {n:2})，而不会解析为(a.b = a) = {n:2}
如果理解为右边先运算就会有误解了，虽然右边先赋值成功。
----------------------------分割线---------------------------
附上ECMA262文档：ECMA262
