JavaScript code specifications

JavaScript code specifications

All JavaScript projects apply the same specification.

JavaScript code specifications

Code specifications typically include the following:

• Named rules for variables and functions
• Spaces, indentations, rules for the use of comments.
• Other common specifications...

The code of the specification can be easier to read and maintain.

Code specifications are generally pre-development and can be negotiated with your team members.

The name of the variable

Variable names are recommended to be named using the hump method (camelCase). ):

firstName = "John";
lastName = "Doe";

price = 19.90;
tax = 0.20;

fullPrice = price + (price * tax);

When defining variable names in JavaScript, you should also be aware of the following:

• Variable names should be case sensitive, allowing letters, numbers, dollar signs ($), and underscores, but the first character should not be a number, and spaces and other punctuation marks should not be allowed;
• Variable naming length should be as short as possible, and grasp the main points, as far as possible in the variable name reflects the type of value;
• The naming of variable names should be meaningful;
• The variable name cannot be the key word in JavaScript and the full name of the word is reserved;
• Common methods of naming variable names are Hungarian nomenclats, hump nomenclaceptions, and Pascal nomenclaceptions.

Spaces and operators

Usually a space needs to be added before and after the operator , .

var x = y + z;
var values = ["Volvo", "Saab", "Fiat"];

Code indentation

Typically, four space symbols are used to indent blocks of code:

function toCelsius(fahrenheit) {
    return (5 / 9) * (fahrenheit - 32);
}

Note: Tab keys are not recommended for indentation because the resolution of different editor TAB keys is different.

Statement rule

Common rules for simple statements:

• A statement usually ends with a sign.

var values = ["Volvo", "Saab", "Fiat"];

var person = {
    firstName: "John",
    lastName: "Doe",
    age: 50,
    eyeColor: "blue"
};

Common rules for complex statements:

• Place the opening braces at the end of the first line.
• Add a space before the opening braces.
• Place the closing braces independently on one line.
• Do not end a complex declaration with a sign.

function toCelsius(fahrenheit) {
    return (5 / 9) * (fahrenheit - 32);
}

for (i = 0; i < 5; i++) {
    x += i;
}

if (time < 20) {
    greeting = "Good day";
} else {
    greeting = "Good evening";
}

Object rules

Rules defined by objects:

• Place the opening braces on the same line as the class name.
• There is a space between the colon and the property value.
• Strings use double quotes, and numbers are not required.
• The last property-value pair is not followed by a comma.
• Place the closing braces independently on one line and use the semicum sign as the ending symbol.

var person = {
    firstName: "John",
    lastName: "Doe",
    age: 50,
    eyeColor: "blue"
};

Short object code can be written directly into a line:

var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

Each line of code character is less than 80

To make it easier to read each line of characters is recommended to be less than 80.

If a JavaScript statement exceeds 80 characters, it is recommended to line up after the operator or comma.

Note: In scenarios such as function declarations, function expressions, function calls, object creation, array creation, for statements, etc., are not , or ; Line forward.

Naming rules

Naming rules for many code languages are similar in general, such as:

• Variables and functions are the camelCase method
• The global variable is capital (UPPERCASE). )
• Constants, such as PI, are capitals (UPPERCASE). )

Variables name whether you use these rules: hyp-hens, camelCase, or under_scores ?

Crossbar (-) characters for HTML and CSS:

HTML5 properties can be prefixed with data- (e.g. data-quantity, data-price).

CSS uses - to connect property names (font-size).

Note: - It is generally considered subtracted in JavaScript and is not allowed.

Underline:

Many programmers prefer to use underscores, such as date_of_birth, especially in SQL databases.

The PHP language is usually underlined.

Pascal Case:

Pascal Case has more languages in C.

Hump method:

The hump method is generally recommended in JavaScript, which is used by jQuery and other JavaScript libraries.

Note: Variable names do not start with $ and conflict with many JavaScript libraries.

HTML loads an external JavaScript file

Load JavaScript files in a clean format (type property is not required):

Use JavaScript to access HTML elements

A poor HTML format can cause JavaScript to execute incorrectly.

The following two JavaScript statements output different results:

HTML uses the same naming rules as JavaScript.

Access the HTML(5) code specification.

The file extension

The HTML file suffix can be .html (or r.htm).

The CSS file suffix is .css.

The JavaScript file suffix is .js.

Use a small file name

Most Web servers (Apache, Unix) are case sensitive: the London .jpg not be accessed .jpg London.

Other Web servers (Microsoft, IIS) are case insensitive: London .jpg can be .jpg london .jpg london.

You must maintain a uniform style, and we recommend the uniform use of small-ced file names.

After completing this tutorial, W3Cschool recommends that you take hands-on exercises to reinforce your knowledge: javascript hands-on

JavaScript formatting tool

Online JavaScript formatting tool

Front-end coding specification: JavaScript specification