JavaScript best practices, including performance optimizations, coding practices, and more.

Source: Internet
Author: User
Tags bitwise operators

Yesterday skipped the contents of the previous chapters of the advanced programming of JavaScript, and jumped directly to the chapter of best practice, but that one was very much related to my practice at the time of the internship, so I felt that it should be sorted out and shared, after all, quite a good part.

First, write maintainable code

The maintainable code has some characteristics:

(1) understandable

(2) Intuitive

(3) Adaptability

(4) Extensibility

(5) can be debugged

second, the Code contract

1. Readability: Code indent size is 4 spaces

Where to comment:

(1) Functions and methods: such as the purpose of the function and the algorithm that may be used to complete the task.

(2) Large segment code: Explain what this large piece of code does

(3) Complex algorithms: How the Interpretation algorithm is done

(4) Hack: Explain how special Hack fragments are done.

2, variable and function naming: (Naming to standardize)

(1) Variable name is noun

(2) function name is verb

(3) Logical, should not worry about length

(4) Variable type transparency, such as by initializing the specified variable type, through the Hungarian flag, by specifying the type of the type annotation.

3, attention to loose coupling

(1) Decoupling Html/javascript: try to avoid inserting <script> tags directly into HTML pages

(2) Decoupling Css/javascript: Try to avoid direct manipulation of style, which can be implemented by dynamically changing style classes instead of specific styles. This is still more important, direct changes to the analogy batch changes the style is much better

(3) Decoupling application logic/event handlers: Separating the application logic from the event handlers.

Several principles of loose coupling between application and business logic:

(1) Do not pass the event object to other methods, only the data required from the event object;

(2) Any action that can be applied at the application level should be carried out without executing any event handlers;

(3) Any event handler should handle the event and then transfer the processing to the application logic.

Third, programming practice:

1. Respect for object ownership: That is, you cannot modify objects that do not belong to you. Just do not add properties and methods to the instance or prototype, and do not redefine existing methods.

2, avoid the global volume: is to try to avoid global variables and functions. Create a namespace, and then write the name that you want.

3, in the type detection as far as possible to avoid comparison with NULL, try to use the values instanceof Array.

You can avoid code that is compared to NULL by using the following techniques

(1) If the value is a reference type, use the instanceof operator to check its constructor

(2) If the value is a base type, use typeof to check its type

(3) If the object contains a specific method name, use the typeof operator to ensure that a method with the specified name exists on the object.

4. Use constants as much as possible

For example: so to quote.

5. The types of values that are noted for separating data from the logic that uses it:

(1) Duplicate values can be extracted as a constant

(2) User interface string: can be extracted to facilitate internationalization

(3) URLs: Unify one place to put all URLs

(4) Any value that may change: extracted as a constant.

Iv. Performance Issues

1, as far as possible to avoid global lookups, you can declare elements as a unified variable

2. Avoid with statements as much as possible

3, consider the complexity of the algorithm, try to avoid unnecessary property lookups, try to use the digitized array location to access, you can also use named properties.

4, Optimization cycle: can be used from large to small reduction of the iterative method, simplifying the termination conditions, simplifying the loop body, after the use of the test cycle, that is do-while cycle

5, expand the cycle, using the Duff device.

6, avoid double interpretation. Try to avoid some code evaluation or create new functions. Use native methods, switch methods, and bitwise operators whenever possible.

v. Minimum number of statements

1. Declare as many variables as possible. Direct a var value, and then use, separated just fine.

2. Insert iteration values, such as

3. Using Arrays and object literals

Vi. Optimizing DOM Interaction

1, Minimize the field update: is updated, all the DOM is finished, and then unified rendering

2. Use innerHTML as much as possible

3. Use event proxies whenever possible: Attach event handlers at the document level or attach event programs to higher levels to handle event handling for multiple targets.

4, try to avoid the use of htmlcollection, in the following cases will produce htmlcollection, make getElementsByTagName () call, get the childnodes attribute of the element, get the attributes property of the element , Access Special properties: Document.form,document.images.

VII. Deployment Code

1. You can use the build tool

2, to verify, as far as possible to explore some potential problems:

(1) Use of eval ()

(2) Non-declared use of variables

(3) Missing semicolon

(4) Improper line-wrapping

(5) Incorrect comma use

(6) Parentheses omitted around the statement

(7) Break omitted from switch branch statement;

(8) repeated declaration of variables

(9) Use of With

(10) Incorrect use of the equals sign

(11) Unreachable Code

3, code compression: including file compression and HTTP compression.

in General, this chapter will be the main is how to write the code, write more excellent, said many of the content, I in the internship, have met, usually not much attention, but this is a lot of people need to pay attention to the place.

It's very comprehensive and well-spoken. So we recommend that you try to achieve these standards, so that their code is more excellent. Because when you get started, you'll think about how to write your own code better.

JavaScript best practices, including performance optimizations, coding practices, and more.

Related Article

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.