A very interesting explanation of small Javascript Problems

Let's take a look at the following three sections of code:
Copy codeThe Code is as follows:
Var firstName = "Mark ";
(Function DisplayFirstName (){
Console. log (firstName );
}) (); // Mark output
Var lastName = "Aut ";
(Function DisplayLastName (){
Var lastName = "Bru ";
Console. log (lastName );
}) (); // The Bru must be output. The priority of the local scope is higher than that of the global scope.
// What about the following code?
Var lastName = "Aut ";
(Function DisplayLastName (){
Console. log (lastName );
Var lastName = "Bru ";
Console. log (lastName );
}) (); // Who can guess what the result is?

The output result is:
LOG: undefined
LOG: Bru

This is beyond my expectation. I thought it should be "Aut" and "Bru ".
My original understanding is: when the program first outputs lastName, the program does not find the locally declared lastName variable, so the global lastName definition is used, the value of the local variable is used for the second time.
(Because in my concept, javascript is an interpreted language and executed in a sentence)

Seeing this result, it seems that javascript execution is not all sequential ..
So far, as far as I guess, the javascript execution should first perform syntax analysis, and then complete the variable table (local and global) by the way)
Then begin to execute a line of script in sequence
Also ask javascript experts to explain