Although many developers are happy to praise JavaScript, some still see its dark side.
Web pages that use a lot of JavaScript code will load very slowly. Excessive use of JavaScript makes the web page ugly and laggy. How to use JavaScript effectively has quickly become a very hot topic.
Here let us list 10 best javascript practices to help you use javascript effectively.
1. Keep the code as simple as possible
Perhaps everyone has heard this code simplicity issue N times. As a developer you may have used it many times during your code development process, but never forget this in JavaScript development.
Try to add comments and spaces in development mode to keep the code readable
Please delete spaces and comments before publishing to the production environment, and try to abbreviate variable and method names
Use third-party tools to help you compress JavaScript.
2. Think before modifying prototypes
Adding new attributes to the object prototype is a common cause of script errors.
yourObject.prototype.anotherFunction = 'Hello';
yourObject.prototype.anotherMethod = function () { … };
In the above code, all variables will be affected because they all inherit from "yourObject". Such use can lead to unexpected behavior. Therefore, it is recommended to delete similar modifications after use.
yourObject.prototype.anotherFunction = 'Hello';
yourObject.prototype.anotherMethod = function () { … };
test.anotherMethod();
delete yourObject.prototype.anotherFunction = 'Hello';
delete yourObject.prototype.anotherMethod = function () { … };
3. Debug Javascript code Even the best developers make mistakes. In order to minimize similar errors, please run your code in your debugger and confirm that you do not encounter any subtle errors
4. Avoid Eval
your JS Also works fine without the "eval" method. "eval" allows access to the javascript compiler. If a string is passed as argument to "eval", then its result can be executed.
This will greatly reduce the performance of the code. Try to avoid using "eval" in a production environment.
5. Minimize DOM access DOM is the most complex API and will slow down the code execution process. Sometimes web pages may not load or load incompletely. It's best to avoid DOM.
6. Learn javascript before using javascript libraries
The Internet is flooded with many javascript libraries, and many programmers tend to use js libraries without understanding the negative effects. It is strongly recommended that you learn basic JS code before using third-party libraries, otherwise, you will be out of luck.
7. Do not use the "SetTimeOut" and "Setinterval" methods as alternatives to "Eval" setTimeOut( "document.getID('value')", 3000) ;
In the above code document.getID('value') is processed as a string in the "setTimeOut" method. This is similar to the 'eval' method, which executes a string on every code execution and therefore reduces performance, so it is recommended to pass a method in these methods.
setTimeOut(yourFunction, 3000);
8. [] is better than "new Array();" A common mistake is to use when an array is required When using an object, use an array when using an object. But the usage principle is simple:
"When property names are small consecutive integers, you should use an array. Otherwise, use an object." - Douglas Crockford, author of JavaScript: Good Parts.
Suggestion:
var a = ['1A','2B'];
Avoid:
var a = new Array();
a[0] = "1A";
a[1] = "2B";
9. Try not to use var multiple times When initializing each variable, programmers are accustomed to using the "var" keyword. Instead, it is recommended that you use commas to avoid redundant keywords and reduce code size. As follows:
var variableOne = 'string 1',
variableTwo = 'string 2',
variableThree = 'string 3';
10. Don't ignore the semicolon"; "
This is often one of the reasons why people spend hours debugging.
I’m sure you must have read the above related content in other articles, but everyone may often ignore many basic rules. Have you ever overlooked a semicolon? Have you ever encountered the eval keyword problem causing performance problems? I hope you all like it, thank you!