之前看过 《You don't know js》中说到的 LHS ,RHS.
然而还是对这个知识点懵懵懂懂 ， 了解粗浅。
碰到这种题目一时间还是无法理解:
var foo = { n: 1 };
var bar = foo;
foo.x = foo = { n: 2 };
console.log(foo.x) // ?
console.log(bar.x) // ?
在这之前先简单说一下前提概念：
简述编译原理
JavaScript 程序中的一段源代码在执行之前会经历三个步骤，统称为 编译
1. 分词/词法分析
2. 解析/语法分析
3. 代码生成
先看原书对一个赋值操作的拆解说明：
变量的赋值操作会执行两个动作，
首先编译器会在当前作用域中声明一个变量（如果之前没有声明过），
然后在运行时引擎会在作用域中查找该变量，如果能够找到就会对它赋值。
而要讲的 LHS 和 RHS 就是上面说的对变量的两种查找操作，查找的过程是由作用域（词法作用域）进行协助，在编译的第二步中执行。
LHS 和 RHS
字面意思其实是 Left Hand Side和 Right Hand Side 即左手边和右手边
一般可以理解为 赋值操作的左侧和右侧
但更准确来说，
LHS 是 查找变量的 内存地址 (类似于C语言中的变量对应的指针值)
RHS 是 查询变量的 值.
先举个最简单的例子:
var a=1;
从这里 发生了一次 LHS 引用: var a... ,获取 a 的变量地址，然后把 1 赋值给 a.
再来一个:
console.log(a);
显然 , 为了打印 变量 a 的值 , 这里需要获取到 a的具体值 , 发生了 RHS
延伸到函数:
function sayHi(name){
console.log(name);
}
sayHi('小明');
第一步，这里 sayHi ('小明') ,其中 sayHi... 调用了RHS,获取这个函数的内容.
第二步，括号里面进行了一次传参，也就是 name = 小明 , 发生了一次LHS，把 小明 赋值给 name
第三步， console.log(..)本身也需要一个 RHS 引用，即对 console 对象进行 RHS 查询，并且检查得到的值中是否有一个叫做 log 的方法。
第四步， console.log(name) , 为了获取到 name具体的值 发生RHS ,
总结就是 , 执行 sayHi('小明') 这个过程中 ,一共发生了 一次LHS，三次RHS。
可以来道小题练练手:
试试找出其中的3处 LHS 查询，4处 RHS 查询
function foo(a) {
var b = a;
return a + b;
}
var c = foo(2);
答案：
LHS 查询
c = ..;
a = 2(隐式变量分配）
b = ..
RHS 查询
foo(2..
= a;
a ..
.. b
重新做题
接下来回到文中开头的题目:
var foo = { n: 1 };
var bar = foo;
foo.x = foo = { n: 2 };
console.log(foo.x) // ?
console.log(bar.x) // ?
详细解析可以参考
https://juejin.im/entry/5acb0dc55188255c5668bbe2?utm_source=gold_browser_extension