Scope, pre-parsing, and variable promotion in JavaScript

Scope: Scope of a variable

  1. Local scope: inside a function

    Variables declared in local scope are called local variables, and local variables can only be used inside the current function

    1) The function creates a new space in memory during execution

    2) When the function is executed, the scope space is closed (the variable is destroyed)

    Note that parameters are also local variables

    function fn() {
        let b = 5
     	// access variable b locally
        console.log(b) / / 5
    }
    fn()
    // Global access variable b
    console.log(b) // Failed to access a variable that does not exist
    Copy the code

    Print the following on the console

  2. Global scope: outside the function

    1) Variables declared in a global scope are global variables, which can be used anywhere

    2) Because global variables can be used anywhere, pay special attention to local variables

    let a = 2
    function fn() {
        // access variable A locally
        console.log(a) / / 2
    }
    fn()
    // Global access variable A
    console.log(a) / / 2
    Copy the code

    Print the following on the console

    The reason why variable A can be accessed inside a function is that there is a function chain. When accessing a variable inside a function, it will first look for it in its scope. If it cannot find a variable, it will look for it in the higher scope, and an error will be reported

    For example:

    (Error not found)

    function fn() {
        function fn1() {
            function fn2() {
                // access variable A locally
        		console.log(a) / / 2
            }
            fn2()
        }
        fn1()
    }
    fn()
    Copy the code

    Console printing

(Local access to global variables)

let a = 'hello javascript'
function fn() {
    function fn1() {
        function fn2() {
            // access variable A locally
    		console.log(a) // hello javascript
        }
        fn2()
    }
    fn1()
}
fn()
Copy the code

Console printing

  1. Block-level scope: similar to local scope

    1) Wrap a piece with {}

    2) Let declared variables have block-level scope, while var declared variables do not

    For example,

    (Take a literal object as an example)

    let obj = {
        uname: "Outlaw maniac.".age: 68
    }
    Copy the code

    Properties in this object must be accessed through the obj. Property, not directly

Preliminary analysis

Pre-parsing: Variables and functions are parsed to the front of the current scope before code execution

Any scope is pre-parsed before execution (functions over variables)

Variable: a variable with a declaration, defined but not assigned

1) The variable is accessed before the declaration, and the value of the variable is undefined

Function: a function with a name that is defined but not called

1) Functions are superior to variables

console.log(a) // undefined
fn() // hello javascript

function fn() {
    console.log('hello javascript')}var a = 2
Copy the code

The code is executed from the top down, but is preparsed before execution, pushing variable and function declarations to the top of the current scope, as shown in console.log(a), which prints undefined

But, look out!! Attention!!

The variable must be declared by var. If the variable is declared by let, an error will be reported

Graph (VAR declaration of a)

Figure (A of let declaration)

Variable ascension

Preparsing causes variables to be promoted

An error occurs if a variable is not declared

console.log(a) / / an error
Copy the code

Console printing

Use the var statement

console.log(a) // undefined

var a = 'hello javascript'
Copy the code

The console prints undefined, we know the variable definition doesn’t assign a value and it says undefined, so the variable already exists and it’s promoted, but it’s just promoted, it’s not promoted, so if it’s not promoted, Console.log (a) will return an error as above

Conclusion: There is variable improvement in VAR

Use the let statement

console.log(a) / / an error

let a = 'hello javascript'
Copy the code

Conclusion: There is no variable enhancement in LET

Supplement:

Declare variables: let \ var \ const

1) The variable declared by let is not in the window

2) The variable declared by var is equivalent to adding an attribute to window

3) The variable declared by var does not have block-level scope, while let does

4) Var can be declared repeatedly, let can only be declared once

5) Const is used to define constants and cannot be changed

6) A constant defined by const must be initialized with a value. Let may not set a value

Suggestion: Capital letters are recommended for constant names because they are immutable values