Precautions for writing JavaScript code, it is recommended to collect!

In the process of our front-end development, we need to follow certain code writing rules, so that we can write more reasonable, easy to read and maintain code, so do you know what needs to be paid attention to in JavaScript?

1. Block-level scope let replace var-a grammatical programming style

1. ES6 proposes two new commands for declaring variables: let and const.

Among them, let can completely replace var, because the semantics of the two are the same, and let has no side effects.
Insert picture description here

If the above code replaces let with var, it actually declares two global variables, which is obviously not an ideal design. Variables should only be valid within the code block in which they are declared, the var command cannot do this.

2. Var command has variable promotion effect, let command does not have this problem.
Insert picture description here

3. Between let and const, it is recommended to use const first, especially in the global environment, variables should not be set, constants should be set. The reason is that const can remind people who read the program that this variable cannot be changed, which is more in line with functional programming ideas, and the JavaScript compiler will optimize const, so more use of const will help improve the efficiency of the program.
Insert picture description here

2. Strings Static strings always use single quotation marks or backquotes, and do not use double quotation marks. Use backticks for dynamic strings.

Insert picture description here

Three. Deconstruction assignment

ES6 allows extracting values ​​from arrays and objects and assigning values ​​to variables according to a certain pattern, which is called destructuring
Insert picture description here

Four. Other operations

1. Object operation

The object should be as static as possible, and once defined, new attributes should not be added at will. If adding attributes is unavoidable, use the Object.assign method.
Insert picture description here

The attributes and methods of the object, try to use concise expressions
Insert picture description here

2. Use the spread operator (...) to copy the array
Insert picture description here

3. The immediate execution function can be written in the form of an arrow function.
Insert picture description here

4. Use Class to replace the operation of prototype. Because Class is written more concisely and easier to understand.
Insert picture description here

5. Position of brackets-programming style in grammatical format

1. Position of braces

Most programming languages ​​use curly braces ({}) to denote code blocks. There are many different ways of writing the position of the opening brace. There are two most popular.

The first is to start the brace on a new line-recommended
Insert picture description here

The second is that the opening brace is followed by the keyword, but Javascript will automatically add a semicolon at the end of the sentence, which may cause some undetectable errors.
Insert picture description here

2. Parentheses

Parentheses have two functions in Javascript, one means calling a function, and the other means a combination of different values. We can use spaces to distinguish these two different parentheses.

When calling a function, there is no space between the function name and the opening parenthesis.
Insert picture description here

There is no space between the function name and the parameter sequence.
Insert picture description here

There is a space between all other grammatical elements and the opening parenthesis. The
Insert picture description here
above is the precautions for writing JavaScript code that Xiaoqian shared with you today. I hope this article can be helpful to those who are preparing to learn Web front-end technology.

Guess you like

Origin blog.csdn.net/xiaoxijinger/article/details/114822926