JavaScript pre-parsing and related skills analysis _ javascript skills

This article mainly introduces the JavaScript pre-parsing and related skills, and analyzes the principles, steps, and related skills of JavaScript and parsing in the form of examples, if you need it, you can refer to the examples in this article to describe JavaScript pre-parsing and related skills. We will share this with you for your reference. The details are as follows:

Variable

Similarly, start with the error comparison prompt of the two small examples.

Alert (y1); // code segment 1var y1 = 'ddddd'; alert (y2); // code segment 2 // alert (typeof y2); y2 = 'xxxxx ';

First, let's think about why one will prompt undefined, but one will throw an undefined variable error .. Let's first look at the parsing process of JavaScript.

Before javascript is executed, an event is "pre-parsed ". The parsing engine executes the creation of all var variables at the block level and gives them an initial value: undefined. In this way, the reason why undefined is displayed in the first example is obvious.

So the first code is equivalent

Var y1; alert (typeof y1); // The value is undefinedy1 = 'ddddd ';

Why did the second part of the code throw an error? At this time, it is no longer in the "pre-resolution" phase. (here I assume that when the browser encounters a script tag, only two things are done: pre-resolution and execution are not the only two tasks), but are in the execution stage, the error is thrown because js does not know the status of y2 in the execution segment (any information about y2 is not captured in the pre-resolution phase). Of course, an undefined error message is thrown. Another problem is involved here: js is a weak language and variables cannot be defined. Why is a definition error thrown here.

There is always a reason, and javascript always has many strange features. One of them is variable read/write inequality. Undefined variables are only writable and not readable. Everyone is familiar with the following method:

Y2 = 'exam'; // before its definition operation (that is, before it has its own scope), this operation considers this code as defining a global variable, register a property y2 on the window and assign the value to exam.

However, in its read operations, the js engine does not find any relevant information, so it will act with its own temper and throw an undefined error. This is the game rule of js. But why can we get its type. Remember how js operates on objects. If the access object has a non-existent property and type, the system will prompt undefined (because it is currently an attribute of the window object ).

Note: We need to distinguish between them. The read and write inequality of variables is only used for variables, reading the attributes of all objects. This feature does not exist. If it does not exist, undefined is displayed.

Conclusion

Here, I think: they have some similarities with the write operations on variables and objects. however, read operations have their own set of rules. For this reason, the above problem occurs.
In this way, the answer to the question below should be easily obtained.

if (!('a' in window)) {  var a = 1;}alert(a);

Function

Extended, function. remember the pre-resolution mentioned above. In the pre-resolution of javascript, in addition to the pre-Definition of the var variable, it also includes the extraction of the definition of the function, therefore, functions can be defined anywhere in the script and called anywhere. Not limited to its earlier.

However, the function definition method includes a literal definition method. Use the var method to declare the function. See the following:

Alert (typeof y3); // result? Var y3 = function () {console. log ('1 ');}

Remember this Convention: The call must appear after the declaration. Why? If you understand the above, the answer here is clear. The javascript engine will give them an undefined initial value when pre-parsing var, so that if we call it before its declaration, the javascript engine has not yet obtained its real value, the error "xxx is not a function" is reported. this also clarified why it is the same as the function declaration, but it is related to the declaration and call sequence, but there is no such constraint.

Conclusion

It is a function that is executed in js and the result of Dynamic Modification still follows the pre-resolution rules of variables (when alert is above, it does not get the information of the literal function ).
What if it is a mixture of two. As shown in the following figure, there are both variables and functions for y4.

Alert (typeof y4); // result? Function y4 () {console. log ('y4')} var y4;

Because javascript has a high declared priority of the function during pre-parsing, y4 is of the function type, but after y4 is assigned a value (the js engine is executing at this time ), the value assignment operation on js will overwrite the function declaration. Therefore:

alert(typeof y5);var y5 = 'angle';function y5(){  console.log('ghost');  }alert(y5);

The first alert result is a function because it is at the top of the js execution process. The value of alert has been rewritten to 5 for the second time (do not be confused by the position defined by the function .)

Just by thinking separately from the parsing and execution of js, we can find that the answer to many questions has naturally surfaced. As the author of the article said, "Once you understand the execution environment, calling objects, closures, lexical scopes, and scope chains, many JavaScript language phenomena can be solved. "

Now let's look at it again. Even in many incredible languages, there are many reasons that can be traced back to it.

How to better judge Parameters

After discussing the above, how can we make it closer to actual development? Since javascript reads and writes are not equal, how can we avoid parameter judgment without errors.

Eg:

If (cusVar) {// is there an implicit problem. }

How should we be more rigorous.

If (window ['cusvar']) {// ensure that it does not report an error. // Or this judgment is also feasible window. cusVar | typeof cusVar! = 'Undefined' // work}

Finally, I added another small quiz (understanding the separation of pre-resolution and execution)

var y7 = 'test';function fun1(){  alert(y7);  var y7 = 'sex';}fun1();