A brief discussion on JavaScript scope

1. Scope

Generally speaking, the names used in a program code are not always valid and available, and the scope of code that limits the availability of the name is the scope of the name. The use of scope improves the locality of program logic, enhances program reliability, and reduces name conflicts.

There are two types of scopes in JavaScript (before es6):

• Global Scope
• Local scope (function scope)
• After ES6, there is also a block-level scope, which will be described in detail later.

1. Global scope

Applies to the environment where all code is executed (the entire script tag) or a separate js file.

2. Local scope

The code environment that acts on a function is the local scope. Because it is related to functions, it is also called function scope.

For example:

  for(let i=0;i<100;i++){
       sum += i;
   }

2. Scope of variables

In JavaScript, variables can be divided into two types according to their scope:

• Global variables
• Local variables

1. Global variables

Variables declared in the global scope are called global variables (variables defined outside a function).
Global variables can be used anywhere in the code. Variables declared with var in the global scope are global variables. In special cases, variables declared without var in a function are also global variables (not recommended).

2. Local variables

Variables declared in a local scope are called local variables (variables defined inside a function)
Local variables can only be used within a function. Variables declared with var within a function are local variables. Function parameters are actually local variables.

3. The difference between global variables and local variables

• Global variables: can be used anywhere and will only be destroyed when the browser is closed, so they take up more memory.
• Local variables: are only used inside a function. They are initialized when the code block they are in is executed. They are destroyed when the code block is finished, thus saving more memory space.

3. Scope Chain

According to the mechanism that inner functions can access outer function variables, chain search is used to determine which data can be accessed by inner functions, which is called scope chain.

• As long as it is code, it has at least one scope
• Local scope written inside a function
• If there is a function within a function, then another scope can be created within this scope.

For example: Analyze the following code to determine the result.

function f1() {
    var num = 123;
    function f2() {
        console.log( num );
    }
    f2();
}
var num = 456;
f1();

The analysis is shown in the figure below:

It can be seen that the final result is: 123

Similarly, the final value of the variable can also be found by adopting the proximity principle.

This is the end of this article about the details of JavaScript scope. For more relevant JavaScript scope content, please search 123WORDPRESS.COM’s previous articles or continue to browse the following related articles. I hope you will support 123WORDPRESS.COM in the future!