In C and Java, there is an entry function or method for a program, that is, the main function or the main method. In JavaScript, the program runs from the head of the JS source file. But in a sense, we can still invent a main function as the starting point of the program, so that not only can be unified with other languages, and perhaps you will have a deeper understanding of JS.
1. The actual entrance
When a JavaScript file is handed over to the JS engine, the JS engine executes each statement from top to bottom until all the code is executed.
2. Scope chains, global scopes, and global objects
We know that each function in JS produces a new scope when it executes. Specifically, a new scope is created when the execution process enters the function, and the scope is destroyed when the function execution finishes exiting. function parameters, local variables are bound to this scope, and when the function call finishes destroying the scope, they are destroyed. Of course, in special cases, if some variables in the scope are still referenced when the function returns, then the scope and the referenced variables are not destroyed, resulting in so-called closures .
On the other hand, we know that functions can be nested, so scopes can be nested as well. When the function is defined, the JS engine sets a built-in property called [[scope]] for each function, which points to the lexical scope of the external function. In this way, multiple scopes form a chain structure called a scope chain . In general, there is only one scope chain at any time, that is, starting from the scope of the function being executed, and going up the layer up to the outermost global scope .
[note]: function on the scope chain is the function of layer nesting in JS source code, which is not related to the order of function execution or function call stack, which is also the origin of lexical scope.
The global scope is a special scope and is not a function scope, but it is the outer scope of all function scopes and the end point of all scope chains. So as long as the program does not exit, the global scope always exists, and the variables in the global scope are still valid.
[Scope of function 3]-->[function 2 scope]-->[function 3 scope]-->[global scope]
In addition, it corresponds to the global scope, and there is a global object . In the browser, the global object is the Window object. The global object is a special object:
- Variables defined in the global scope are bound to global objects.
- Variables defined in any scope are bound to global objects if they are not defined with the var keyword.
- In the global scope, this points to the global object.
As you can see from the features listed above, if you think of the global scope as an object, it is actually a global object. In addition, this explains why the following four statements are equivalent in the global scope:
var a = 1= 1= 1; this. A = 1;
3. The fictional main function
Since all are scopes, why do we have a special global scope? We always like simplification, consistency, and try to avoid complications, particularity. So naturally, do we want to make the global scope look no different from the scope of the function? The answer is yes. We can make such a concept:
We imagine that when the JS engine executes the source file, it wraps the code in the file into a function called Main. The main function is then used as the entrance to the program.
In other words, suppose a JS file has such a code:
var a = 1; var b = 2; function Add (x, y) { var z = x + y; return Z;} Console.log (Add (A, b));
The JS engine wraps it into a main function before the program starts executing:
// the fictional main function function Main () { var a = 1; var b = 2; function Add (x, y) { var z = x + y; return z; } Console.log (Add (A, b));}
Then, call this main function:
// set global scope (object) to window // point this to window
4. What is the point?
(1) JS also has an entry function, main, which is consistent with other languages.
(2) The concept of global scope is omitted, or the global scope becomes a function scope.
(3) through the process of calling the main function above, we can understand the origin of those special properties in the global scope.
(4) The last point, will all JS source code as a function, is for the following event queue, event loop to do the groundwork.
JavaScript Note (c): JS also has an entry function main