Shulou(Shulou.com)06/02 Report--

This article introduces the relevant knowledge of "what are the simple JS coding standards". In the operation of actual cases, many people will encounter such a dilemma, so let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!

1. Use = instead of = when comparing

This is important because JavaScript is a dynamic language, so using = = can give you unexpected results because it allows for different types.

Fail:

If (val = = 2)

Pass:

If (val = = 2)

two。 Never use var, use let instead

Using let will help avoid scope problems caused by various var in JavaScript.

Fail:

Var myVar = 10

Pass:

Let myVar = 10

3. Use const instead of let

This prevents developers from trying to change things that should not be done, and does help improve readability.

Fail:

Let VAT_PERCENT = 20

Pass:

Const VAT_PERCENT = 20

4. Always use semicolons (;)

Although this is optional in JavaScript, it does not require a semicolon as a statement Terminator like other languages. But using; helps to keep the code consistent.

Fail:

Const VAT_PERCENT = 20; let amount = 10 return addVat (amount, vatPercent)

Pass:

Const vatPercent = 20; let amount = 10; return addVat (amount, vatPercent)

5. Naming conventions in JavaScript

Let should be named after the hump.

Const if you use uppercase serpentine naming at the top of the file. If it is not at the top of the file, use hump naming.

Class should be Pascal nomenclature: MyClass

The functions function should be named for the hump: myFunction

6. Use template strings when concatenating strings

Embedded expressions are allowed in template strings.

Fail:

Let fullName = firstName + "" + lastName

Pass:

Let fullName = `${firstName} ${lastName}`

7. Use the ES6 arrow function whenever possible

The arrow function is a more concise syntax for writing function expressions.

Fail:

Var multiply = function (a, b) {return a * b;}

Pass:

Const multiply = (a, b) = > {return a * b}

8. Always use braces around the control structure

All control structures must use curly braces (for example, if,else,for,do,while, etc.) so that they are not prone to errors in later maintenance.

Fail:

If (valid) doSomething (); if (amount > 100) doSomething (); else if (amount > 200) doSomethingElse ()

Pass:

If (valid) {doSomething ();} if (amount > 100) {doSomething ();} else if (amount > 200) {doSomethingElse ();}

9. Make sure the curly braces start on the same line with a space in the middle

Fail:

If (myNumber = = 0) {doSomething ();}

Pass:

If (myNumber = = 0) {doSomething ();}

10. Try to reduce nesting

Nesting if in if can become confusing and difficult to read. Sometimes you may not be able to solve the problem, but you can take a good look at the code to see if you can improve it.

Fail:

If (myNumber > 0) {if (myNumber > 100) {if (! hasDiscountAlready) {return addDiscountPercent (0);} else {return addDiscountPercent (10);}} else if (myNumber > 50) {if (hasDiscountAlready) {return addDiscountPercent (5);}} else {if (! hasDiscountAlready) {return addDiscountPercent (0) } else {return addDiscountPercent (1);} else {error ();}

Pass:

If (myNumber 100) {return addDiscountPercent (10);} if (myNumber > 50) {return addDiscountPercent (5);} return addDiscountPercent (1)

As you can see from the above example, after nesting is reduced, it becomes easier to read.

11. Use default parameters whenever possible

In JavaScript, if you don't pass parameters when you call a function, its value is undefined

Fail:

MyFunction (a, b) {return a + b;}

Pass:

MyFunction (a = 0, b = 0) {return a + b;}

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

I usually try not to use the switch statement, but you do want to use it, make sure that every condition is break and write defalut.

Fail:

Switch (myNumber) {case 10: addDiscountPercent (0); case 20: addDiscountPercent (2); case 30: addDiscountPercent (3);}

Pass:

Switch (myNumber) {case 10: addDiscountPercent (0); break; case 20: addDiscountPercent (2); break; case 30: addDiscountPercent (3); break; default: addDiscountPercent (0); break;}

13. Do not use wildcard import

Fail:

Import * as Foo from'. / Foo'

Pass:

Import Foo from'. / Foo'

14. Shortcuts to use Boolean values

Fail:

If (isValid = true) if (isValid = false)

Pass:

If (isValid) if (! isValid)

15. Try to avoid unnecessary triple statements

Fail:

Const boo = a? A: b

Pass:

Const boo = a | | b; "what are the simple JS coding standards"? thank you for reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.