SoFunction
Updated on 2025-04-12

Quickly understand the usage of LHS and RHS queries in JavaScript

A piece of source code in a JavaScript program will go through three steps before execution, collectively called compilation

  • Word participle/lexical analysis
  • Analysis/grammatical analysis
  • Code generation

Let’s first read the original book’s explanation of a assignment operation:
The assignment operation of a variable will perform two actions. First, the compiler will declare a variable in the current scope (if it has not been declared before), and then the engine will look for the variable in the scope at the runtime, and if it can be found, it will be assigned a value. --- "JavaScript You Don't Know (Volume 1)" P7

The LHS and RHS to be discussed are the two search operations for variables mentioned above. The search process is assisted by the scope (lexical scope) and is executed in the second step of compilation.

LHS and RHS

  • Literally, it means Left Hand Sideand Right Hand Side That is, the left hand side and the right hand side
  • Generally, it can be understood asLeft and right sides of assignment operation

Let's take a look at an example first

(a);

Here is an RHS reference to a because a does not assign any value, and the purpose is to get the value of a and print it out.

a = 2;

Here is an LHS reference to a because we don't actually care what the current value is, we just want to assign a to 2.

Let's look at Example 2

function foo(a) {
  (a); // 2
}
foo(2);
  • The last line of the call to the foo(..) function requires an RHS reference to foo, which means that the value of foo is taken, and (..) means that foo needs to be executed, so it is better to be a function-type value.
  • There is an implicit assignment operation that is easily ignored a = 2, which occurs when 2 is passed into foo as an actual parameter. That is, the actual parameter 2 is passed to the formal parameter a, and an LHS query is required
  • The console line also has an RHS reference (or query) to a. At the same time, (..) itself also requires an RHS reference, that is, perform an RHS query on the console object and check whether there is a method called log in the obtained value.
  • There is a conversation between engines and scopes in the book, which helps to understand Example 2 well.see YDKJS github

Quiz

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

Try to find out 3 of the LHS queries and 4 RHS queries

Answer:

LHS Query:

c = ..;
a = 2 (implicit variable assignment)
b = ..

RHS Query

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

summary

Refer to the original book Chinese version P12, see the English versiongithub

  • Scope is a set of rules that determine where and how to find variables (identifiers).
  • If the purpose of the search is to assign values ​​to a variable, an LHS query will be used; if the purpose is to obtain the value of the variable, an RHS query will be used.
  • The assignment operation results in an LHS query. The = operator or the operation passing in parameters when calling a function will cause the assignment operation of the associated scope, that is, it will cause the LHS query.
  • The JavaScript engine first compiles the code before it is executed. In this process, declarations like var a = 2 are broken down into two independent steps:
  • First, var a declares new variables in its scope. This will be done at the initial stage, that is, before the code is executed.
  • Next, a = 2 will query (LHS query) the variable a and assign it to it.
  • LHS and RHS queries will start in the current execution scope. If necessary (that is, they do not find the required identifier), they will continue to look for the target identifier to the superior scope, so that each time they rise to the scope one level and finally reach the global scope, which will stop whether found or not.
  • An unsuccessful RHS reference will cause a ReferenceError exception to be thrown. An unsuccessful LHS reference results in an automatic implicit creation of a global variable (in non-strict mode) that uses the target of the LHS reference as an identifier, or throws a ReferenceError exception (in strict mode).

The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.