IT Course JavaScript Basics 041_Conditional Statements if, else, switch

Conditional statements in JavaScript mainly include if, else if, else, and switch.

if Statement

The if statement is used to determine whether to execute a piece of code based on a condition. When the conditional expression in the if(...) statement parentheses is true, one line of statement after if is executed. If you want to control multiple lines of code, you can use {} to enclose the statements. It is recommended to always use curly braces {} to wrap code blocks when using if statements, even if there is only one statement, as this improves code readability. If the conditional expression is false, it will not execute. If the conditional expression after if is not a boolean value, it will first be converted to a boolean value before evaluation. The number 0, empty string "", null, undefined, and NaN are all converted to false. Other values are converted to true.

Example:

1
let age = 18;
2
if (age >= 18) console.log('Adult');
3
if (age >= 18) {
4
  console.log('Adult');
5
}

if-else Statement

The if-else statement can execute different code blocks based on different conditions. If the expression evaluates to true, the code block after if is executed; otherwise, the code block after else is executed.

Example:

1
let age = 25;
2
if (age >= 18) {
3
  console.log('Adult');
4
} else {
5
  console.log('Minor');
6
}

else if Statement

The else if statement is an extension used in the if-else structure, allowing you to add multiple conditions for evaluation. The else if statement evaluates the conditional expressions after if from top to bottom until a true condition appears. When a true condition appears, subsequent conditions will not continue to be evaluated, so you need to properly design the order of conditions or add logical operation conditions.

Example:

1
let score = 95;
2
if (score >= 90) {
3
  console.log('Excellent');
4
} else if (score >= 60) { //Try moving this condition to first and see what happens?
5
  console.log('Pass');
6
} else {
7
  console.log('Fail');
8
}

switch Statement

The switch statement can replace multiple if statements for multi-branch selection based on the value of an expression. When the switch statement executes, it compares the expression after switch with the expressions after case using strict equality. If the comparison result is true, the switch statement executes the code block after the corresponding case until it encounters the nearest break statement (or until the end of the switch statement). If there is no matching case, the default code block is executed (if default exists).

Example:

1
let day = 7;
2
switch (day) {
3
  case 1:
4
      console.log('Monday');
5
      break;
6
  case 2:
7
      console.log('Tuesday');
8
    break;
9
  case 6: //case grouping
10
  case 7: //Several case branches sharing the same code can be grouped together
11
      console.log('Weekend');
12
      break;
13
  default:
14
      console.log('Other');
15
}

break Terminates (Ends, Exits) Loop

break is used to terminate (end, exit) the current loop or switch statement. If there is no break, subsequent case statements will continue to execute (i.e., “fall-through” occurs).

Example:

1
let day = 2;
2
switch (day) {
3
  case 1:
4
    console.log('Monday');
5
    break;
6
  case 2:
7
    console.log('Tuesday');
8
    // No break, will continue to execute the next case
9
  case 3:
10
    console.log('Wednesday');
11
    break;
12
  default:
13
    console.log('Other');
14
}