二、分支语句

什么是分支语句

• JS 代码是从上往下按照顺序依次执行的, 从第一行代码一直执行到最后一行
• 如果有一种情况是我有两段代码, 我只需要执行其中一个即可, 那么就可以用到分支语句
• 简单来说: 分支语句就是根据我们设定好的条件来决定要不要执行某些代码

1. if 分支语句

1.1 if 分支语句的基本书写

• 语法: if (条件) { 想要执行的代码 (满足条件的时候执行的代码, 如果不满足, 这里边的代码永远不执行) }

    if (true) {
        console.log('因为条件是 true 所以 我可以打印出来')
    }
    //语法分析:
    //if: 关键字,表明后续是一段if分支语句
    //(): 小括号内部填写条件, 用于决定是否执行后续内容
    //{}: 花括号内部填写要执行的分支代码, 如果条件为真, 则会执行
复制代码
复制代码

1.2 if ... else 语句的基本书写

语法: if (条件) { 条件为真时 执行的代码 } else { 条件为假时 执行的代码 }

    if (true) {
        console.log('因为条件是 true 所以 我可以打印出来')
    } else {
        console.log('因为条件是 true 所以 我不会被打印')
    }
    
    
    if (false) {
        console.log('因为条件是 false 所以 我不会被打印')
    } else {
        console.log('因为条件是 false 所以 我可以打印出来')
    }
    /**
     * 语法分析:
      
      if: 关键字,表明后续是一段if分支语句
      
      (): 小括号内部填写条件, 用于决定是否执行后续内容
      
      {}: 花括号内部填写要执行的分支代码, 如果条件为真, 则会执行
      
      else: 表明前边条件都为false时,执行后续的花括号内的代码

    */
复制代码
复制代码

1.3 if 嵌套语句的基本书写

• 可以通过 if 和 else if 来设置多个条件进行判断

• 语法: if(条件1){条件1为true时执行} else if (条件2){条件2为true时执行}

• 会从头开始依次判断条件

  • 如果第一个条件为 true 了, 那么就会执行后面的 {} 的内容
  • 如果第一个条件为 false, 那么就会判断第二个条件
  • 如果第二个条件也为 false, 那么会依次往后执行

• 注意

  • 多个 {} 只会有一个被执行, 一旦有一个条件为 true 了, 后面的就不再判断了
  • 如果所有的 条件都为 false, 那么会执行最后的 else {} 分支
  • 如果所有的条件都为 false, 且没有最后的 else {} 分支, 那么当前 if 分支不会有任何代码段会被执行

2.switch 分支语句

• switch 也是 条件判断语句的一种, 是对于某一个变量的判断(全等的判断,数据类型不一致时会导致判断失败)

2.1 switch 分支语句的基本书写

   switch (要判断的变量) {
       case 情况1:
           情况1执行的代码
           break;
       case 情况2:
           情况2执行的代码
           break;
       case 情况3:
           情况3执行的代码
           break;
       default:
           上述情况都不满足时执行的代码
   }
复制代码
复制代码

• switch 通常是判断某一个变量等于某一个值的时候使用, 比如用户输入一个数字显示今天周几, 输入一个数字显示今天是几月

2.2 switch 穿透语句的基本书写

• switch 再书写的时候 如果不写 break 会出现穿透现象

• 穿透现象:

  • 从第一个满足条件的 case 开始
  • 如果没有 break, 后面的条件不在判断, 直接执行代码
  • 直到遇到一个 break 或者 switch 结束

//根据月份, 输出对应的天数    (2月按照28天)
       var month = 2  // 再控制台输出5月有?天

       switch (month) {
           case 1:
           case 3:
           case 5:
           case 7:
           case 8:
           case 10:
           case 12:
               console.log('有31天')
               break

           case 4:
           case 6:
           case 9:
           case 11:
               console.log('有30天')
               break

           case 2:
               console.log('有28天')
               break
       }
 //结果：有28天
复制代码
复制代码

3. 三元表达式

• 三元表达式(三目表达式/三目运算符/问号冒号表达式/三元运算/三目运算/三目)语法

  • 条件 ? 真-执行的代码 : 假-执行的代码

• 意义

  • 对 if else 语句的简写

• 注意

  • 执行代码的位置只能写一句话

• 常用场景

  • 利用三目执行代码(对if else 的优化)
  • 利用三目给变量赋值

// 执行代码
var num = 5
num % 2 == 0 ? console.log('num 为偶数') : console.log('num 为奇数')

// 给变量赋值
var num = 1 // 我们暂且规定 num == 1 时代表为男性, num == 2 时代表为女性
var gender = num == 1 ? '男' : '女'
console.log(gender)