This chapter introduces some methods to optimize the execution efficiency of javascript. I personally feel that it is pretty good. Friends who are interested can learn more.
1. In low-version browsers (such as IE6, IE7, etc.) When concatenating strings, using the join method of the array is much more efficient than using numbers to connect (such as ['aaa', 'bbb', 'ccc'].join() is more efficient than 'aaa' 'bbb' 'ccc');
2. Array:
pop is more efficient than shift, push is more efficient than unshift. This is important for designing a binary heap structure. It is best to place the largest or smallest element at the end of the array.
3. It is best to use shift operations for rounding numbers:
1 >> 0;
4. Use direct quantities to create Array and Object:
var a = []; var o = {};
5. Object hierarchy Don’t nest too much and reduce the search for objects:
Don’t use a.b.c.d.e, this design method to obtain the e object.
6. Key-value correspondence, compared with switch case, key-value correspondence is more efficient than switch case. It has been tested by various browsers. You can read the article about this comparison: JavaScript small experiment;
7. If you use jq, there is a comparison between $('xxxx').empty().append('xxxxxxx'); and $('xxxxx').html('xxxxx'); , the result is:
$('xxxx').empty().append('xxxxxxx'); wins, the article address is jQuery small experiment;
8. Loop
In JavaScript, we can use three types of loops: for(;;), while(), and for(in). Among these three loops, for(in) is extremely inefficient because it needs to query the hash key, as long as It should be used as little as possible if possible. The performance of for(;;) and while loop should be said to be basically equivalent (when used in daily use).
If the loop variable is incrementing or decrementing, do not assign a value to the loop variable alone. You should use the nested or - operator when it is last read.
If you want to compare with the length of the array, you should put the length attribute of the array into a local variable in advance to reduce the number of queries.
9. Local variables and global variables
Local variables are accessed faster than global variables, because global variables are actually members of the global object, and local variables are placed in functions in the stack.
10. Not using Eval
Using eval is equivalent to calling the interpretation engine again to run the content at runtime, which takes a lot of time. At this time, the function template can be implemented using the closure supported by JavaScript (for the content of closure, please refer to the relevant content of functional programming);
11. String connection
If it is appending characters String, it is best to use s = anotherStr operation instead of s = s anotherStr;
12. Convert numbers into strings and use "" 1. Although it looks a bit ugly, in fact this The efficiency is the highest, in terms of performance:
("" +) > String() > .toString() > new String()
This is actually somewhat similar to the "direct quantity" below. Try to use internal operations that can be used at compile time rather than user operations used at runtime. quick.
String() is an internal function, so it is very fast, while .toString() queries the function in the prototype, so it is not as fast. new String() is used to return an exact copy;
13. Convert floating point numbers to integers. This is more error-prone. Many people like to use parseInt(). In fact, parseInt() is used to convert strings into numbers, not between floating point numbers and integers. , we should use Math.floor() or Math.round().
14. String traversal operation
To perform loop operations on strings, such as replacement and search, regular expressions should be used, because the loop speed of JavaScript itself is relatively slow, and regular expressions The operation is an API written in C language, and the performance is very good;
15. Timer
If the target is continuously running code, setTimeout should not be used, but setInterval should be used . SetTimeout needs to reset a timer every time;
The above is the entire content of this chapter. For more related tutorials, please visit JavaScript Video Tutorial!