JavaScript中的分支结构

分支结构

在一个程序执行的过程中，各条代码的执行顺序对程序的结果是有直接影响的。很多时候我们要通过控制代码的执行顺序来实现我们要完成的功能。

简单理解：流程控制就是来控制代码按照一定结构顺序来执行,就是根据我们设定好的条件来决定要不要执行某些代码

流程控制主要有三种结构，分别是顺序结构、分支结构和循环结构，代表三种代码执行的顺序。

顺序流程控制

​

​ 顺序结构是程序中最简单、最基本的流程控制，它没有特定的语法结构，程序会按照代码的先后顺序，依次执行，程序中大多数的代码都是这样执行的。

IF 条件分支结构（重点）

由上到下执行代码的过程中，根据不同的条件，执行不同的路径代码（执行代码多选一的过程），从而得到不同的结果

JS 语言提供了两种分支结构语句：if 语句、switch 语句

if 语句

• 通过一个 if 语句来决定代码是否执行

• 语法： if (条件) { 要执行的代码 }

• 通过 () 里面的条件是否成立来决定 {} 里面的代码是否执行

  // 条件为 true 的时候执行 {} 里面的代码
  if (true) {
    alert('因为条件是 true，我会执行')
  }
  
  // 条件为 false 的时候不执行 {} 里面的代码
  if (false) {
  	alert('因为条件是 false，我不会执行')    
  }
  

if else 语句

• 通过 if 条件来决定，执行哪一个 {} 里面的代码

• 语法： if (条件) { 条件为 true 的时候执行 } else { 条件为 false 的时候执行 }

• 两个 {} 内的代码一定有一个会执行

  // 条件为 true 的时候，会执行 if 后面的 {} 
  if (true) {
    alert('因为条件是 true，我会执行')
  } else {
    alert('因为条件是 true，我不会执行')
  }
  
  // 条件为 false 的时候，会执行 else 后面的 {}
  if (false) {
    alert('因为条件为 false，我不会执行')
  } else {
    alert('因为条件为 false，我会执行')
  }
  

if else if … 语句

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

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

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

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

• 多个 {} ，只会有一个被执行，一旦有一个条件为 true 了，后面的就不在判断了

  // 第一个条件为 true，第二个条件为 false，最终会打印 “我是代码段1”
  if (true) {
    	alert('我是代码段1')
  } else if (false) {
  	alert('我是代码段2')           
  }
  
  // 第一个条件为 true，第二个条件为 true，最终会打印 “我是代码段1”
  // 因为只要前面有一个条件满足了，就不会继续判断了
  if (true) {
    	alert('我是代码段1')
  } else if (true) {
    	alert('我是代码段2')
  }
  
  // 第一个条件为 false，第二个条件为 true，最终会打印 “我是代码段2”
  // 只有前一个条件为 false 的时候才会继续向后判断
  if (false) {
    	alert('我是代码段1')
  } else if (true) {
    	alert('我是代码段2')
  }
  
  // 第一个条件为 false，第二个条件为 false，最终什么也不会发生
  // 因为当所有条件都为 false 的时候，两个 {} 里面的代码都不会执行
  if (false) {
    	alert('我是代码段1')
  } else if (false) {
    	alert('我是代码段2')
  }
  

if else if … else 语句

• 和之前的 if else if ... 基本一致，只不过是在所有条件都不满足的时候，执行最后 else 后面的 {}

  // 第一个条件为 false，第二个条件为 false，最终会打印 “我是代码段3”
  // 只有前面所有的条件都不满足的时候会执行 else 后面的 {} 里面的代码
  // 只要前面有一个条件满足了，那么后面的就都不会执行了
  if (false) {
    	alert('我是代码段1')
  } else if (false) {
    	alert('我是代码段2')
  } else {
    	alert('我是代码段3')
  }
  

SWITCH 条件分支结构（重点）

switch 语句也是多分支语句(条件判断语句)，它用于基于不同的条件来执行不同的代码。当要针对变量设置一系列的特定值的选项时，就可以使用 switch

• 是对于某一个变量的判断

• 语法：

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

  • 要判断某一个变量 等于 某一个值得时候使用

• 例子🌰： 根据变量给出的数字显示是星期几

  var week = 1
  switch (week) {
    case 1:
      alert('星期一')
      break
    case 2:
      alert('星期二')
      break
    case 3:
      alert('星期三')
      break
    case 4:
      alert('星期四')
      break
    case 5:
      alert('星期五')
      break
    case 6:
      alert('星期六')
      break
    case 7:
      alert('星期日')
      break
    default:
      alert('请输入一个 1 ～ 7 之间的数字')
  }
  

• switch ：开关 转换 ， case ：小例子 选项

• 关键字 switch 后面括号内可以是表达式或值， 通常是一个变量

• 关键字 case , 后跟一个选项的表达式或值，后面跟一个冒号

• switch 表达式的值会与结构中的 case 的值做比较

• 如果存在匹配全等(===) ，则与该 case 关联的代码块会被执行，并在遇到 break 时停止，整个 switch 语句代码执行结束

• 如果所有的 case 的值都和表达式的值不匹配，则执行 default 里的代码

  注意： 执行case 里面的语句时，如果没有break，则继续执行下一个case里面的语句。

• switch 语句和 if else if 语句的区别

  • 一般情况下，它们两个语句可以相互替换
  • switch…case 语句通常处理 case为比较确定值的情况， 而 if…else…语句更加灵活，常用于范围判断(大于、等于某个范围)
  • switch 语句进行条件判断后直接执行到程序的条件语句，效率更高。而if…else 语句有几种条件，就得判断多少次。
  • 当分支比较少时，if… else语句的执行效率比 switch语句高。
  • 当分支比较多时，switch语句的执行效率比较高，而且结构更清晰。

三元运算（扩展）

• 三元运算，就是用 两个符号 组成一个语句

• 三元运算只是对 if else 语句的一个简写形式

• 语法： 条件 ? 条件为 true 的时候执行 : 条件为 false 的时候执行

  var age = 18;
  age >= 18 ? alert('已经成年') : alert('没有成年')