12 easy to read, understandable, maintainable JavaScript programming tips

Tram Ho

1. Standard javascript programming principles

No need to be sublime, in the first place do your best as you can. Therefore, in this article it is not necessary to emphasize that you have to be like this, but should not ignore the standards in your code that includes the following 3 elements:

  • Consistency of data and code.
  • Easy to read and understand for others.
  • Easy to maintain when something goes wrong.

2. Use === instead of == when comparing

This is important because JavaScript is the most typed language, so using == can give you undesirable results as it allows for different types.

Should not

Should be like this


In a comparison using the == operator, the result will return true if the two are compared equally.

But there is an important drawback : If a comparison is made between two different value types, value types, then type coercion occurs. Each JavaScript value belongs to a specific type. These categories are: Numbers, strings, Booleans, functions , and objects . So if we try to compare a string to a number, the browser will try to convert the string to a number before performing the comparison. Similarly, if you compare true or false with some value true or false will be converted into 1 or 0, respectively.

With the help of the browser the examples above have gone out of our way

For example, to see using == is difficult to predict what awaits us

With the help of the browser the examples above have gone out of our way. For this reason, javascript always advises us to use the === operator instead of == . We try to apply it again and see the correct results

Similarly, there is a comparison != , This type is also k different than using == . Replace with !== .

3. Never use var , use let instead

Using let avoids the scope issue like var in javascript.

Should not

Candlestick

The var problem is most clearly detected in Block Scope, for example

Results:

Why does it continue to run when out of scope (i = 10)?

To answer this question you should learn about Scope closures first.

There is a first disadvantage when using var, it will change the variable i lead to erroneous results even though we are very careful in programming, without exception.

The second disadvantage of using var is redeclaring.

For example:

In this example, number = 3 has no error at all, but this leads to two people in the team flutter just because I declared, but he also declared …

Now let’s switch to let to see the difference

Result:

Ok, it differs from var by generating an error letting the coder know that the variable i ended and died in the block scope. Next one more:

We receive a sentence

Great, save the confusion

4. Always use const if possible

This prevents coders from trying to change the don’ts and it actually helps to improve readability. And should always capitalize when naming.

Should not

Candlestick

For example:

Because it is a constant it doesn’t change, but there will be special cases where the const will change (I’ll update in the next post)

5. Always use a semicolon ;

Although there are cases we don’t let ; at the end of the statement is not wrong like in other languages ​​like Python. But better to make the code look more familiar we should also use ; at the end of a statement as a good habit.

Should not

Candlestick

6. Use Template strings when concatenating String

When using Template literals (Template strings), the code looks more historical and leaves a lot more impression.

Should not

Candlestick

7. Use the function arrow in ES6 whenever possible

function arrow is a more concise syntax for writing function expressions. But also remember there are cases when the arrow function should not be used. ( When to use ES5 regular and ES6 arrow functions )

Should not

Candlestick

8. Always use strict control if you use if else

Avoiding else being possible, the better in the condition check

Should not

Candlestick

9. Make sure the parentheses start on the same line with a space in between

Should not

Candlestick

10. Try to avoid nesting conditions

if In that if becomes confusing and difficult to read. Sometimes you may not be able to solve the problem, but you can look closely at the code structure to see if it can be improved.

Should not

Candlestick

11. Use the default parameters whenever possible

In JavaScript, if you don’t pass a parameter when calling the function, its value is undefined

Should not

Candlestick

12. The Switch statement should use break and should have default

I usually try not to use the switch statement, but if I want to use it, remember in each condition there is a break and use defalut .

Should not

Candlestick

Conclude

Programming standards of any language can really help improve an application’s readability and maintainability. If you work in a team, one of the tough things is enforcing the code standards so that the entire team can understand what we’re doing. And you can refer to this article. If you are unsatisfied with the above suggestions then you can find a lot more about the Principles of JavaScript Programming .


Source: https://medium.com/javascript-in-plain-english/19-simple-javascript-coding-stiterias-to-keep-your-code-clean-7422d6f9bc0?site=anonystick.com

Share the news now

Source : Viblo