JS program implementation and sequential implementation of detailed _javascript skills

Source: Internet
Author: User
Declaration and invocation of functions
JavaScript is a descriptive scripting language that is dynamically parsed and executed by browsers. The function is defined in roughly the following two kinds, the browser for different ways have different parsing order.
The code is as follows:
Copy Code code as follows:

Definition function definition
function Fn1 () {
Alert ("Hello world!");
}
An assignment function definition
var Fn2 = function () {
Alert ("Hello wild!");
}

During page loading, the browser scans each JS block (or file) on the page or load. If a defined function is encountered, preprocessing (similar to C, etc.) is done, and the processing is completed before starting from top to bottom, and when an assignment function is encountered, the function is only assigned to a variable without preprocessing ( Similar to the principle that a variable in 1 must be first defined and then processed before it is called. Here's a simple example:
The code is as follows:
Copy Code code as follows:

Definition function definition
Fn1 ();
function Fn1 () {
Alert ("Hello world!");
}

Normal execution, pop-up "Hello world!", the browser to Fn1 preprocessing, and then from Fn1 (), start execution.
The code is as follows:
Copy Code code as follows:

An assignment function definition
Fn2 ();
var Fn2 = function () {
Alert ("Hello wild!");
}

Firebug Error: FN2 is not a function, the browser did not preprocess the FN2, the sequence executes, so the error Fn2 undefined.

3. code block and JS file processing
"code block" refers to a pair of <script type= "text/web Effects" ></script> tags wrapped in the JS code, file refers to the file, nonsense: D
The browser scans each block or file independently, and then executes the global code sequentially (as mentioned in 2). So, in a block (file), a function can be defined "defined" after the call, but in two blocks, the block in which the function is defined must precede the block in which the function is called.
Very round the mouth, see examples of good:
The code is as follows:
Copy Code code as follows:

<script type= "Text/javascript" >
Fn ();
</script>
<script type= "Text/javascript" >
function Fn () {
Alert ("Hello world!");
}
</script>
Error: Fn is notdefined, two blocks in exchange.

4. The duplicate definition function overrides the previous definition
This is the same as the duplicate definition of a variable, code:
The code is as follows:
Copy Code code as follows:

function fn () {
Alert (1);
}
function fn () {
Alert (2);
}
FN ();
Pop-up: "2"

If so:
The code is as follows:
Copy Code code as follows:

FN ();
function fn () {
Alert (1);
}
function fn () {
Alert (2);
}
Or pop-up: "2"

Or pop-up "2", why? 2 said it all.

5. The onload function of the body and the execution of the function inside the body
The function inside the body is executed before the OnLoad function to test the code:
The code is as follows:
Copy Code code as follows:

HTML head ...
<script type= "Text/javascript" >
function Fnonload () {
Alert ("I am outside the wall!");
}
</script>
<body onload= "Fnonload ();" >
<script type= "Text/javascript" >
Alert ("I am inside the Wall.");
</script>
</body>
First eject "I am inside the Wall";
Then pops up "I am outside the wall!"

The body of the OnLoad event trigger condition is the body content loading completed, and the body of the JS code in this event before the trigger run (why? 6 tell you ...)

6. JavaScript is multithreaded or single-threaded?
Strictly speaking, JavaScript is not a multithreaded concept, all programs are "single-threaded" sequential execution.
To cite a less-than-appropriate example:
The code is as follows:
Copy Code code as follows:

function fn1 () {
var sum = 0;
for (var ind=0; ind<1000; ind++) {
SUM + + ind;
}
Alert ("The answer is" +sum);
}
function fn2 () {
Alert ("I know, I just don't say");
}
FN1 ();
FN2 ();

First eject: "The answer is 499500",
After the pop-up: "I know, I just don't say."

Then you must ask: that delay execution, Ajax asynchronous loading, not multithreading it? Yes, the following programs do look like "multithreading":
The code is as follows:
Copy Code code as follows:

function fn1 () {
settimeout (function () {
Alert ("I call first")
},1000);
}
function fn2 () {
Alert ("I call after");
}
FN1 ();
FN2 ();
First eject: "I call after",
1 seconds to eject: "I call first"

It looks like the fn2 () and the delay program are going to go in two separate processes, but actually, this is the "callback" mechanism in JavaScript that works, like "interrupts and responses" in the operating system--The delay program sets an "interrupt", and then executes FN2 () for 1000 milliseconds, Then callback execution fn1 ().
Similarly, 5 of the body of the OnLoad event called function, but also using the callback mechanism--body after loading completed, callback execution Fnonload () function.
The data processing function in the AJAX request is the same.
A more in-depth discussion of JavaScript threading issues, see the threads in this JavaScript I see, and a brief introduction to JavaScript multithreaded programming on INFOQ.
Sleepy, say the callback function again.

7. Callback function
What does a callback function do? is the function of callback execution, and nonsense: D
As 6 said, the most common callback is the onclick, Onmouseo Tutorial ver, onmousedown, onload and so on browser event invocation function, as well as Ajax asynchronous request data processing function; settimeout delay execution, SetInterval loops execute functions, and so on.
Let's simply write a pure callback function to play:
The code is as follows:
Copy Code code as follows:

function Onback (num) {
Alert ("Shanshan I am Late");
Execute num Slap
}
function dating (hours, callBack) {
var sp= 0; SP, Rage value
The female pig feet stood hours for an hour in the snow.
Loop start ...
SP + +;
Loop End ...
CallBack (SP);
}
Dating (1, onback);

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.