Part I programming style

Chapter 3 statements and expressions

In JavaScript, statements such as if and for can be written either as multi-line code wrapped in curly braces or as single-line code without curly braces. Such as:

// Bad writing, although this is legal JavaScript code
if(condition)
    doSomething();
    
// Bad writing, albeit legal JavaScript code
if(condition) doSomething();

// Good way to write it
if (condition) {
    doSomething()
}

// Bad writing, albeit legal JavaScript code
if (condition) { doSomething() }
Copy the code

Curly braces should always be used whether a block statement contains multiple lines of code or a single line of code, because omiting curly braces can cause some confusion.

All block statements should use curly braces, including:

• if
• for
• while
• do… while…
• try… catch… finally

3.1 Alignment of curly braces

There are two main styles of curly brace alignment. One way is to place an open curly brace at the end of the first line of code in a block, such as:

if (condition) {
    doSomething();
} else {
    doSomethingElse();
}
Copy the code

Another style is to place curly braces on the first line of a block statement. Such as:

if (condition)
{
    doSomething();
}
else
{
    doSomethingElse();
}
Copy the code

The author personally recommends using the first.

3.2 Block statement interval

There are three main styles of block statement spacing. In the first style, there is no space between statement names, parentheses, and open curly braces.

if(condition){
    doSomething();
}
Copy the code

The second style is to add a space before and after the left parenthesis, as in:

if (condition) {
    doSomething();
}
Copy the code

The third style is to add a space after the parenthesis and before the closing parenthesis, as in:

if ( condition ) {
    doSomething()
}
Copy the code

The author recommends a second style, which is a compromise between the first and the third.

3.3 switch statement

3.3.1 the indentation

switch(condition) {
    case "first":
        / / code
        break;
        
    case "second":
        / / code
        break;
        
    case "third":
        / / code
        break;
        
    default:
        / / code

}
Copy the code

The above characteristics of this style are:

• Each case statement is indented one level relative to the switch keyword.
• Starting with the second case statement, each case statement is preceded by a blank line.

Another style:

switch(condition) {
case "first":
    / / code
    break;
case "second":
    / / code
    break;
case "third":
    / / code
    break;
default:
    / / code
}
Copy the code

The main differences from the previous method are that the case keyword remains left aligned with the switch keyword, and there are no blank lines.

3.3.2 “Continuous Execution” of case Statements

swith(condition) {
    
    // The sequence is obvious
    case "first":
    case "second":
        / / code
        break;
        
    case "third":
        / / code
        
        /* fall through */
    default:
        / / code
}
Copy the code

In this switch statement, there are two apparent “consecutive executions”, and we think this logic is reasonable for the program to execute the second case after the first case.

The second example is case Third executing the logic in default. This process is specified in the comments and is intentional by the program writers.

The authors recommend that continuous execution of case statements be used as long as it is intentional and annotated.

3.3.3 default

Many people believe that default should never be omitted, even if default does nothing.

The author would prefer to omit default if there is no default behavior and a comment is written:

switch(condition) {
    case "first":
        / / code
        break;
        
    case "second":
        / / code
        break;
        
    / / there is no default
}
Copy the code

3.4 with statement

The with statement changes how variables are parsed by the contained context, allowing access to properties and methods of a particular object in the form of local variables and functions that omit object prefixes altogether.

In strict mode, the with statement is explicitly prohibited, and the authors strongly recommend avoiding it.

3.5 a for loop

There are two types of for loops: a traditional for loop, and a for-in loop.

Traditional for loops are often used to iterate over a group of members, and there are two ways to change the execution of the loop (other than using a return or throw statement). The first is to immediately exit the loop using a break statement, and the second is to use a continue statement, which immediately exits the loop and enters the next iteration of the loop.

Crockford’s programming specification disallows the use of continue. He advocates using conditional statements rather than continue in code.

The authors recommend avoiding continue whenever possible, but there is no reason to ban it entirely, and its use should be determined by code readability.

JSLint will issue a warning when continue is used, but JSHint will not.

3.6 the for – in circulation

A for-in loop is used to iterate over object properties.

The problem with a for-in loop is that it iterates not only over the instance properties of the object, but also over the properties inherited from the prototype. When iterating over attributes of a custom object, it often ends with unexpected results. For this reason, it is best to use the hasOwnProperty() method to filter out instance properties for for-in loops.

var prop;

for (prop in object) {
    if (object.hasOwnProperty(prop)) {
        console.log("Property name is" + prop);
        console.log("Property value is"+ object[prop]); }}Copy the code

Crockford’s programming specification requires that all for-in loops must use hasOwnProperty(). By default, both JSLint and JSHint will warn for for-in loops that do not use hasOwnProperty() in the loop body.

The author recommends always using hasOwnProperty() in for-in loops unless you want to find prototype chains, which should be commented out.

One other thing to note about for-in loops is that they are used to iterate over objects. A common mistake is to use for-in loops to iterate over group members.