Improve javascript efficiency by judging once instead of judging again and again_javascript tips

Judgment means making a choice when faced with 2 or more options. For example, there is a fork in the road in front of my house to go to the company. As long as I know which way is right for the first time, I don't have to think about it next time or every time in the future. I can just take that way - of course. Sudden natural disasters do not count.
Making a judgment takes time and requires corresponding conditions. Correct judgment is good, but making a judgment every time you face a fork in the road, even if you have taken countless forks, is undoubtedly a kind of brain-dead behavior.

Let’s take a look at a JS function that we often see. Its function is to determine the browser type and then set the corresponding transparency attribute:

Is there something wrong with this function? No. First determine whether the browser is a standard browser. If so, set transparency directly through opacity; if not, use IE filters to achieve transparency.

The logic is clear, the code is concise, and it’s excellent!

However, there are no mistakes, but there are mistakes.

Usually, this function that sets transparency is used to create a fade effect, which means it will be called by setTimeout again and again until the loop ends.

This is where the problem comes. Going back to the previous fork in the road problem, this function is equivalent to thinking and making judgment every time you come to the intersection. The first time, I came to the intersection, wait, let me see, oh, it is Firefox, take the first road; the second time, I came to the intersection again, wait, let me see, oh, it is Firefox again. , and took the first route...the third time...the fourth time. . . . No matter how many times, this function will check your identity like the most dedicated traffic policeman——Aren’t you annoyed? If you don’t bother me, I’ll be too!

At this time, if you are passing by, you definitely want this traffic policeman to disappear.

In fact, when we encounter a fork in the road, we can do this: Since we already know that there is only one way to go, I might as well block the other way! Of course, this is impossible to do in real life, but it is not difficult to implement in code. Just change your thinking.

There is a magical thing about JavaScript, which is anonymous functions (usually used for self-execution). What does a self-executing function mean? It will be executed when it is declared, and it will not appear again in the future. Do you want to You may not be able to find it even if you look for it! Personally, I think this feature is pretty good.

Look at the code below, which is also a function for setting transparency:


Maybe you are dissatisfied: What the hell is this? , seems to be at the level of a beginner (you saw through it...) but! This one is much more efficient than the previous version. If you don’t believe it, you can alert this function under Firefox and IE6 respectively, and you will understand.

Through the self-executing function, the function is executed when setAlpha is declared, and the function of this function is to judge the browser and determine which method of setting transparency should be used. Since the browser type cannot change after opening the page, there is no need to judge it in the future. Even if you call this function 100,000 times, it will not judge again, but execute it directly.

Although the code is ugly, the state is different...

This example is just a small demonstration. I just hope you can understand the principle of "judge once, not again and again", and Carry forward. Reducing the number of judgments will greatly improve the efficiency of js.
Reprinted from:jo2.org