For Loop is a very basic javascript knowledge, but because javascript is too flexible, there may be some writing that causes beginners to crash. I decided to explain the for Loop in a simple way. It would be helpful for new users who are still new to me to avoid detours.
I. Basic for loop writing
The Code is as follows:
The Code is as follows:
// Example 1 for (var I = 1; I <= 10; I ++ ){
Alert (I );
}
This code is too simple and I am so embarrassed to come up with it. The execution result of the Code is 1 to 10 in sequence, PS: In the early IE such as IE6, you change 10 to 10000, so that the user can always be certain and cannot do anything. Haha-Don't say it's my idea.
As this is a basic course, let's go back to the subject and analyze the code in detail.
The structure of the for Loop is similar, and any for loop is like this:
For (before the start; condition for loop execution; after the end of a loop ){
// Subject Code
} If you take a closer look at the for loop, you will find that his 10 thousand years remain unchanged: After the for (), there will always be and only two; (semicolon )!
The preceding Structure Code shows that the semicolon is used to separate the execution conditions of the for loop. These conditions are all indispensable and can be blank, but the location must be kept, so there must be two ;.
Before you start: It is generally used to declare some variables, such as var I = 0 in Example 1. It is like preparing a token, and there is nothing in it. The number of tools is not limited. You can declare 100 variables before the for loop starts, except for poor reading.
For example, if I <10 in the 1st example is a condition, the for Loop will continue only when the condition is true, the condition of Example 1 can be viewed as if (I <10) {// do ...}. As you can imagine, a batch can hold up to 10 items. If there are 10 more items, it will not be installed and the loop will exit.
What to do after one loop: In example 1, you simply add something to the notebook. In fact, you can do a lot of things. After all, it is not easy to loop once.
Note: the code before the for loop starts is executed only once, without affecting the efficiency of the entire for loop, while the "conditions" and "what to do after one end ", the number of cycles you have and the number of times it executes, so they often become the bottleneck of the for Loop performance.
If we say there are 1st for loops; the first is what we did before the start, can I get the previous thing before the for loop? Just define it before you start. The answer is yes:
The Code is as follows:
// Example 2
Var I = 0;
For (; I <10; I ++ ){
Alert (I );
}
However, you should note that, although there is no content before the start in the brackets behind the for, the; (semicolon) is still there! And must be in!
Similarly, since there are 2nd; the Code that follows is executed after one end, I can also put the code to be executed after the for loop. As follows:
The Code is as follows:
// Example 3
Var I = 0;
For (; I <10 ;){
Alert (I );
I ++
}
But it still exists.
The above are two basic "partial door usage... Don't talk about me.
As you can see, the execution cycle condition cannot be raised separately and must be placed between two semicolons! Before and after attacks!
2. Partial writing of for Loop
1. Let's change the code of Example 1:
Var I = 0;
For (; I <10; alert (I ++); how? This is the trap! {} is gone! But it is completely correct!
But this writing method is too much against the day, 2nd; it is better not to have more code behind, you cannot grasp the value of I, and because of code chaos, it may lead to human syntax errors.
Applicable environment:
Simple for loop operations, such as creating an array of numbers from 1 to 1000 in sequence, use this method, cool is just a word.
2. In-depth Analysis
The preceding example shows that the execution condition of the for loop is to judge a Boolean value, as shown in the following code:
The Code is as follows:
Var t = true;
If (t = true ){
Alert ('Ah! ')
}
No one can understand this if statement. You can write it like this:
The Code is as follows:
Var t = true;
If (t ){
Alert ('Ah! ')
}
The effect is the same. If the condition for the for loop is to judge the Boolean value, it is not difficult to understand the following method:
The Code is as follows:
Var I = 10;
For (; I --){
Alert (I );
}
The effect of this Code is to pop up 10 to 1 in sequence (and the opposite of Example 1 ). The for loop is simply executed, but according to our previous explanation, the conditions are as follows:
The Code is as follows:
If (I ){
// Do
}
That is, if I is true, the execution will continue. When is the I of this for loop true, as long as I is not equal to 0, an empty string, undefined, null, or false.
Therefore, the for loop is executed until I = 0. However, we won't see 0 in the code, confusing new users and installing B.
3. Another
Let's look at the code first. snandy:
The Code is as follows:
Var ary = ["jack", "tom", "lily", "andy"];
For (var I = 0, a; a = ary [I ++];) {
Console. log ();
}
Still pay attention to the conditions for running the for Loop: a = ary [I ++]. Note that here is = rather than =. If it is =, the loop will not be able to proceed.
This condition is very difficult to judge and I am also dizzy. Similar:
If (a = B) {...} // note =!
If B is false, false is returned.
Return to the example above, if I ++ adds a header, then ary [I ++] is false (null, undefined), so the condition becomes false, so the loop is broken.
This example is very limited. snandy also mentioned that, for example, if your array contains a value of 0, the loop may end.
4. A jQuery Method
The Code is as follows:
Function sibling (elem ){
Var r = [],
N = elem. parentNode. firstChild;
For (; n = n. nextSibling ){
If (n. nodeType === 1 & n! = Elem ){
R. push (n );
}
}
Return r;
}
This is the way to obtain the sibling node extracted from jquery. He has a strange for loop. The condition for loop is to judge whether n is true. Since n is always an html node, it is always true. After each loop ends, the next node of n is assigned to n. When the next node of n is absent, n is set to false to terminate the loop.
Summary:
From all the examples above, we can see that any of his strange for loops cannot be separated from two ;. Everyone wants to understand the principle of a for loop, and you can simply separate the for loop with a; line.
3. Efficiency Optimization of the for Loop
1. cache Variables
This is also the most common efficiency optimization method:
The Code is as follows:
Var arr = [1000, 23,...,];
For (var I = 0, l = arr. length; I //
}
Since the execution condition must be determined for each loop, if the length is read from arr for each loop, it will be a waste of time and will inevitably increase the number of computations, resulting in a waste of efficiency.
2. Reverse Order Method
For example, an array has 1000 elements. If you do not consider the extraction order, you can perform an inverted loop:
The Code is as follows:
Var arr = [1000, 23,...,];
Var I = arr. length;
For (; I> 0; I --){
// Alert (I );
}
Why is reverse order more efficient than sequential order? No scientific reason! In fact, it is only because the reverse order can use less variable (compare with the previous example). Apart from this, there is no speed difference between the two.
3. Note that
This is the basic logic. If there are 1000 li and one li has a special className, we need to find this li. So, as we have determined that there is only one such li, we should jump out immediately when we find this li, break, and the following cycle is unnecessary. In this way, because the probability of li is 999/1000 is not the last one, we can certainly save a lot of computing.
In other cases, please refer to the opposite.
4. Use a portal
I have introduced more than just a good-looking method. Most of them have the effect of saving variables and saving computing. They can be used only when they are used. They are both cool and effective. Why not?
---------------------------- Summary --------------------------------
I like the flexibility of Javascript, not just for cool installation. I hope to learn more about JS in the blog Park. I often read articles by the experts, which has benefited a lot. Below are some cool people I have found in the garden, not all. If they are not listed, don't curse me.
Cloudgamer, situ zhengmei, Uncle Tom, snandy, and other low-key experts. Search for their blog.
PS: I really like the function of inserting code in the blog garden. In the future, articles that involve a lot of code will be sent directly to the blog garden.
Do not try the following code:
The Code is as follows:
Var arr = [,];
For (var I = 0, l = arr. length; I If (arr [I]> 10000 ){
I ++;
}
}
