To talk about scope is really to talk about where variables are stored in the program and how to find them when the program wants to use them. This is really a funny thing!

How is JS compilation different from traditional languages?

We often think of javascript as a “dynamic” and “interpreted” language. But the truth is that javascript is a compiled language.

In traditional compiled languages, there are three steps before the source code is executed:

The JS engine has to do much more complicated things than these three steps.

With JS, the compilation process is usually only a few microseconds or less before the code is executed.

What happens when var a = 2?

Before we understand scopes, let’s introduce today’s three main characters

When JS encounters var a = 2, the following things happen.

When js encounters var a. The compiler looks at the scope first and says, does the variable A exist?

The compiler generates code for the engine

The generated code handles a = 2.

When the engine runs this code, the engine looks for scope, is there an A variable in the current scope? If not, does the parent scope have one? And then you just keep looking up.

If a variable is found, it is assigned, and if not, the engine throws an exception.

The complete process would look something like this:

LHS query and RHS query

  • Perform an LHS query when a variable appears on the left side of an assignment
  • RHS queries are performed when a variable appears on the right side of an assignment

Actually, that’s not accurate.

The easier way to understand it is this:

RHS is to find a variable (or method)

LHS is the container for the view-lookup variables itself, so that the variable container can be assigned.

That said, it’s a little abstract. Let’s look at an example of how engines and scopes talk to each other.

function foo(a) {
    console.log(a)
} 
foo(2)
Copy the code

Engine :(first RHS query) scope boss, I’m going to RHS reference foo, have you seen it? Scope: The compiler just declared a foo method for you. Engine executing… Engine :(first LHS query) scope boss, I’m going to make an LHS reference for a, have you seen it? Scope: the compiler declared it as a parameter, go ahead, engine execution… Assign 2 to engine A: (second RHS query) scope boss, I’m going to RHS reference scope for Console: it’s a built-in object, go to engine execution… I want to make a RHS reference for a, can you help me to check if it is still there? Scope: rest assured, it has not changed, take to use the engine: thank you, I continue to execute….

As you can see, the code above does three RHS queries and one LHS query, respectively

Scope nesting

The engine looks from the current scope. If it can’t find it, it looks to the parent scope. If it still can’t find it, it looks to the global scope.

If the top layer is found, whether it is found or not, the search is stopped

Here’s an example:

function foo (a) {
    console.log(a + b)
}
var b = 1;
foo(2)
Copy the code

Engine :(RHS query) foo scope, I’m going to RHS reference for b, have you seen it? Foo scope: what the hell, never heard of, go 😡! Engine :(continues to look) the parent scope brother of foo scope, I’m going to make an RHS reference for b, have you seen it? Global scope: I’ve seen b. The compiler just declared a B. Take it

Why distinguish BETWEEN LHS and RHS queries?

Emphasis: LHS and RHS queries, when the query can not find variables, the results are different

  • LHS query, if the query to the global scope, can not find variables, will be very enthusiasticDeclare a variable and return it to the engine

  • RHS query, if no variable is found, willRaise ReferenceError!

  • RHS queries that find variables, but make unreasonable applications, willRaises TypeError

conclusion

Scope has its own set of rules. Used to determine where and how to look for variables.

2, if the purpose of the lookup is to assign a value, perform LHS query

3. If the purpose of the query is to obtain the value of a variable, perform an RHS query

4. Both LHS and RHS queries look up from the current scope, terminating the query if found, and continuing to the top-level scope if not found. The query terminates whether it is found or not at the top level.

ReferenceError will be raised for unsuccessful RHS queries.

6, successful RHS query, unreasonable operations on variables, will raise TypeError.

In non-strict mode, the LHS query will generate a variable if it cannot find a variable.

All read here, move your hand, like before you go, wish you 2021, want everything.

I am Alfy, a GTD practitioner, a deep work practitioner.

Advertising Time:

I made a public account: green lemon reading club, I hope to grow up on the road, accompanied by you.