The most comprehensive Javascript coding specifications (recommended) and javascript Coding

Source: Internet
Author: User

The most comprehensive Javascript coding specifications (recommended) and javascript Coding

1. embedded rules

Javascript programs should be stored in. js files as much as possible and included in the page in the form of <script src = "filename. js"> when called. If Javascript code is not specific to this page, try to avoid writing Javascript code directly on the page.

2. Align indentation and line feed

A) indent

The same indentation standard should be adopted in the same system. This article recommends that the indentation size be 4 spaces. Each compiler has different definitions on the blank size replaced by the Tab key. We recommend that you reset the Tab shortcut key in the editor to four spaces when setting the development environment. Most compilers provide this function. Otherwise, we recommend that you press 4 spaces to indent.

B) line feed

Line breaks are required in the following locations:

After each independent statement is completed;

Before keywords such as if, else, catch, finally, and while;

When the operator is used to change the line, the operator must start at the beginning of the new line.

For line breaks generated when the length of a single row exceeds the limit, refer to the rule in the line length for separation.

1). the string is too long to be truncated.

Each line of code should be less than 80 characters. If the code is longer, try to wrap the line as long as possible. The line feed should be after the operator and punctuation, preferably after the Semicolon ";" or comma. The next line of code is indented to the previous line by four spaces. This effectively prevents errors such as missing code caused by copy and paste and enhances readability.

Truncates a string by a certain length and uses the + operator to connect. Try to separate strings by semantics. For example, Do not disconnect a complete noun. In particular, HTML fragment is indented to maintain the same structure as HTML:

You can also use Arrays for splicing, which makes it easier to adjust the indentation for relative + operations:

2). The ternary operator is too long.

The ternary operator is composed of three parts. Therefore, the line feed should be based on the length of each part to form three different situations:

Do not:

3). Combinations of long logical conditions

When 80 characters cannot meet the requirements due to complicated combinations of logical conditions, each condition should be separated by a line of logical operators, or some logics are separated by logical combinations. Finally, place the right braces () and the left braces ({) in an independent line to ensure that the block with the if statement can be easily visually recognized. For example:

4). Too long JSON and array

If a row occupies too much space due to a large number of object attributes, You can group the attributes by semantics or logic, for example:

By grouping five groups, each row is controlled within a reasonable range and segmented by logic. You can use the same method for arrays with many projects, for example:

5). return Statement

If the return statement uses the execution of the expression as the return value, put the expression and return in the same row to avoid a returned error because the line break is misunderstood as the end of the statement. If no expression is returned after the return keyword, undefined is returned. The default return value of the constructor is this.

Example:

3. Name

Naming methods generally include the following:

A) Description of the naming method

1). camel naming method, such as thisanapple

2). pascal naming method, like ThisIsAnApple

3). Underline naming, such as this_is_an_apple ·

4). Underline the name, such as this-is-an-apple

The following naming method must be strictly used for different types of content:

B) variable name: the camel naming method must be used.

C) parameter name: the camel naming method must be used.

D) function name: the camel name must be used.

E). method/attribute: the camel naming method must be used.

F). Private (protected) Member: it must begin with an underscore (_).

G). Constant name: all uppercase underscores (_) must be used, for example, IS_DEBUG_ENABLED.

H). Class Name: The pascal naming method must be used.

I). Enumeration name: the pascal naming method must be used.

J) Enumeration attributes: all uppercase underlines must be used for naming.

K). namespace: the camel naming method must be used.

L). Semantics: naming also requires attention to semantics, such:

The variable name should use a noun;

A boolean type should start with is or has to indicate its type ;·

The function name should use a moving object phrase;

The class name should be a noun.

4. Notes

Annotations should be as simple and clear as possible. Focus on the meaning of annotations and annotate the less intuitive parts:

(Of course, it is not recommended to directly define a bunch of global variables)

In addition, there are two types of JavaScript Annotations: "//" and "/*.... */", it is recommended that" // "be used as a code line comment ,"/*.... */"is used to deregister the entire code segment, or in more formal declarations, such as descriptions of function parameters, functions, and file functions:

Also, copy and paste the comments to check whether they correspond to the code.

5. Statement

1). Variable Declaration

Although JavaScript does not require that variables be declared before they are used. But we should develop this good habit. In this way, we can easily detect undeclared variables to avoid hidden global variables and cause potential risks.

At the beginning of a function, you should first use the var keyword to declare the local variables to be used in the function, comment out the functions and meanings of the variables, and sort them alphabetically. Each variable occupies a single row to add comments. This is because only the {} of the function indicates the scope in JavaScript. The local variables declared with the var keyword are valid only in the function, while those declared without var are considered as global variables. Example:

The valueA variable declared with var is different from the valueB variable without declaration. Note that the variables declared by var in the function are local variables, which can effectively avoid errors caused by the same name of local variables and global variables.

2). function declaration

The function should also be declared before calling. The internal function should be declared after the var statement declares the internal variable, which can clearly indicate the scope of the internal variable and the internal function.

In addition, there must be a space between the function name '(') 'and, to clearly display the function name with its parameter section, and the start of the function body. If the function is an anonymous or untitled function, leave a space between the function keyword and the left brace '('; otherwise, the function name may be mistaken.

Example of an internal function declaration:

From the output in the preceding example, the inF () function takes effect only within the outF () function, and the innerA local variable takes effect for the scope of the internal function. This encoding method makes the scope of variables and functions clearer.

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.