Are you sure you know the Javascript parsing process ??

Source: Internet
Author: User

Most people may think that the parsing and execution processes of JavaScript are sequential ........

Method2.js:

/** part 2 */function method2(){alert("method2~~");}

<! Doctype HTML> 

I think most people have no doubt about the definitions of these three functions and the final call results. So .....

Test 1:

<! Doctype HTML> 

What happens when I write the call code of Method1 (); method2 (); method3 () above the definition of the method3 function ???

I think most people have no doubt about the execution results of Method1 (); method2. Method1 ~~ is displayed ~~ Method2 ~~ If you have any questions, you have to go to the wall. ^_^

What is the execution result of method3? If you think that the error is reported, you must read it carefully. The result is method3 ~~

Why? An explanation of the sentence in the fifth version of the rhino (JavaScript authoritative guide:
"The function is defined during parsing, instead of running"
That is, the JavaScript engine will first process the function definition and then execute the method call (in this example, only the method call is required );

Next ....

Test 2:

<! Doctype HTML> 

After the conclusion of test 1, the result obtained by the big guy should pop up: Method1 ~~ Method2 ~~ Method3 ~~

However, only 1/3 is correct. Only Method1 is displayed, and an error is reported...

Continue reading...

Test 3:

<! Doctype HTML> 

This time, I wrote the called code in a separate script tag, and the script tag is on top of other script tags.

The execution result is: an error is reported directly.

The alert method must be known as the method of the window object (also known as an attribute of the window, but this attribute is just a function ), during the call, you can omit the window and write alert () directly. You can also write the window. alert ();

After repeated tests, combined with the sentence of the rhinoceros book. I believe that:

Every time the JavaScript engine encounters a script tag, it first processes the function definition (because the function definition is directly written in the script tag, this function is an attribute of the window object ), then execute the code in the script.

Therefore, when the next script tag is encountered, the call will not report an error because the previous definition is already in the window attribute. Note: the JavaScript engine does not load all scripts at a time. It first processes the function definition,

Call again (after this test, the author's opinion ).

Explain the parsing process of test 1

When the JavaScript engine encounters a script tag at the position of Part1, it first defines the Method1 function and assigns the Method1 function to the same name attribute of the window object (this may be inappropriate when it is assigned to the window object attribute ).

No code can be executed in the script tag at the position of Part1 .. So I encountered <SCRIPT src = "method2.js"> loading method2.js, and the subsequent processing is the same as that of Part1.

When Part3 is encountered, process the definition of the method3 function, assign the window object with the same name attribute, and then execute Method1 (); method2 (); method3 (); the background should execute window. method1 (); window. method2 ();

Window. method3 (); the result is Method1 ~~ Method2 ~~ Method3 ~~

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.