1. Process control concept

In the process of a program execution, the execution sequence of each code has a direct impact on the results of the program. A lot of times we control the order in which code is executed to achieve what we want to do.

Simple understanding: Flow control is to control the code to execute in a certain structural order

There are three main structures of process control, namely sequence structure, branch structure and loop structure, which represent the sequence of three code execution.

2. Sequential process control

Sequence structure is the simplest and most basic flow control in the program. It has no specific grammar structure. The program will be executed in sequence according to the sequence of the code, and most of the code in the program is executed in this way.

3. Branch process control

3.1. Branch structure

In the process of executing code from top to bottom, different paths of code are executed according to different conditions (the process of executing more than one code), thus obtaining different results

JS language provides two kinds of branch structure statements: if statement, switch statement

3.2. If statements

3.2.1. Grammatical structure

If (conditional expression) {// Conditional execution of the code statement}Copy the code

Statements can be understood as an action, and loop and branch statements are typical statements. A program consists of many statements, usually divided into separate statements.

3.2.2. Execution process

If else statement (double branch statement)

3.3.1. Grammatical structure

If (conditional expression) {// [if] if the condition is true} else {// [otherwise] execute the code}Copy the code

3.3.2. Execution process

3.4. If else if statement

3.4.1. Grammatical structure

// It is suitable for checking multiple conditions. If (conditional expression 1) {statement 1; } else if (conditional expression 2) {statement 2; } else if (conditional expression 3) {statement 3; . } else {// None of the above conditions are true execute code here}Copy the code

3.4.2. Execute logic

3.5. Switch Branch flow control

3.5.1. Grammatical structure

The switch statement is also a multi-branch statement that executes different code based on different conditions. Switch is used when you want to set a set of options for a variable with a specific value.

Switch (expression){case value1: // Break is the code to execute when the expression equals value1; Case value2: // Break is the code to execute when the expression equals value2; Default: // code to execute when the expression does not equal any value}Copy the code

Switch: switch conversion, case: small example options
The keyword switch can be followed by an expression or value in parentheses, usually a variable
The keyword case, followed by the expression or value of an option, followed by a colon
The value of the switch expression is compared to the value of the case in the structure
If there is a matching congruence (===), the code block associated with the case is executed and stops when a break is encountered, terminating the entire switch statement code execution
If all case values do not match the expression values, execute the code in default

Note: execute a statement in case without a break, proceed to execute the statement in the next case.

3.5.2. Difference between switch statements and if else if statements

In general, the two statements can be substituted for each other
switch… Case statements typically handle cases where case is determined for comparison, whereas if… The else… Statements are more flexible and are often used for range determination (greater than or equal to a range)
The switch statement is directly executed to the conditional statement of the program after the condition judgment, which is more efficient. And the if… Else statements have several conditions, so you have to judge them as many times as you want.
When there are fewer branches, if… Else statements execute more efficiently than switch statements.
Switch statements execute more efficiently and have a clearer structure when there are many branches.

4. Ternary expressions

4.1. Grammatical structure

Expression 1? Expression 2: Expression 3;Copy the code

4.2. Implementation idea

If expression 1 is true, the value of expression 2 is returned; if expression 1 is false, the value of expression 3 is returned
Simple to understand: Similar to short for if else

Process control