JS中的LHS和RHS查询

297 阅读2分钟

本文已参与「新人创作礼」活动, 一起开启掘金创作之路。

1.LHS和RHS的定义

LHS: Left-hand Side(左手边)

RHS:Right-hand Side(右手边)

那么问题只有一个:相对于什么的左右?

简单理解:对于赋值操作的左右,在赋值操作的左边时,就是LHS,在赋值操作的右边时,就是RHS

即:当一个变量出现在赋值操作的左手边时,会进行 LHS 查询,当一个变量出现在赋值操作的右手边时,会进行 RHS 查询。

2.LHS和RHS理解的例子

console.log(a);

上面的代码是取值操作,所以是RHS

a = 2

上面的代码是一个LHS,因为我们实际上不关心当前的值是什么,我们只是想找到这个变量,将它作为 = 2 赋值操作的目标

tips: LHS 和 RHS 意味着“赋值的左/右手边”未必像字面上那样意味着“ = 赋值操作符的左/右边”。赋值有几种其他的发生形式,所以最好在概念上将它考虑为:“赋值的目标(LHS)”和“赋值的源(RHS)”。

3.JS中的LHS和RHS

JavaScript 引擎 在执行代码之前首先会编译它,因此,它将 var a = 2; 这样的语句分割为两个分离的步骤:

  1. 首先,var a 在当前 作用域 中声明。这是在最开始,代码执行之前实施的。
  2. 稍后,a = 2 查找这个变量(LHS 引用),并且如果找到就向它赋值。

LHS 和 RHS 引用查询都从当前执行中的 作用域 开始,如果有需要(也就是,它们在这里没能找到它们要找的东西),它们会在嵌套的 作用域 中一路向上,一次一个作用域(层)地查找这个标识符,直到它们到达全局作用域(顶层)并停止,既可能找到也可能没找到。

未被满足的 RHS 引用会导致 ReferenceError 被抛出。未被满足的 LHS 引用会导致一个自动的,隐含地创建的同名全局变量(如果不是“Strict模式”note-strictmode),或者一个 ReferenceError(如果是“Strict模式”note-strictmode)。

4.测试题

1.考虑下端代码是否出现了LHS引用?

function foo(a) {
    console.log( a ); // 2
}
​
foo( 2 );

2.下面的代码中有几次LHS查询,几次RHS查询,请找出:

function foo(a) {
    var b = a;
    return a + b;
}
​
var c = foo( 2 );

答案1:

出现了LHS引用

有个微妙的赋值请注意:

当传入参数的时候,出现了一个 a = 2 的赋值:

这是一个LHS引用

答案2:

共有3次LHS查询,4次RHS查询

LHS:c = .., a = 2(隐含的参数赋值)和 b = ..

RHS:

foo(2.., = a;, a + .... + b