1 流程控制

1.1 流程控制概念

在一個程式執行的過程中，各條程式碼的執行順序對程式的結果是有直接影響的。很多時候我們要通過控制程式碼的執行順序來實現我們要完成的功能。

簡單理解：流程控制就是來控制程式碼按照一定結構順序來執行

流程控制主要有三種結構，分別是順序結構、分支結構和迴圈結構，代表三種程式碼執行的順序。

1.2 順序流程控制

順序結構是程式中最簡單、最基本的流程控制，它沒有特定的語法結構，程式會按照程式碼的先後順序，依次執行，程式中大多數的程式碼都是這樣執行的。

1.3 分支流程控制

• 分支結構

由上到下執行程式碼的過程中，根據不同的條件，執行不同的路徑程式碼（執行程式碼多選一的過程），從而得到不同的結果

JS 語言提供了兩種分支結構語句：if 語句、switch 語句

if 語句

• 語法結構

// 條件成立執行程式碼，否則什麼也不做
if (條件表示式) {
    // 條件成立執行的程式碼語句
}

語句可以理解為一個行為，迴圈語句和分支語句就是典型的語句。一個程式由很多個語句組成，一般情況下，會分割成一個一個的語句。

• 執行流程

if else語句（雙分支語句）

• 語法結構

  // 條件成立  執行 if 裡面程式碼，否則執行else 裡面的程式碼
  if (條件表示式) {
      // [如果] 條件成立執行的程式碼
  } else {
      // [否則] 執行的程式碼
  }
  
  

• 執行流程

  if else if 語句(多分支語句)

  • 語法結構

    // 適合於檢查多重條件。
    if (條件表示式1) {
        語句1；
    } else if (條件表示式2)  {
        語句2；
    } else if (條件表示式3)  {
       語句3；
     ....
    } else {
        // 上述條件都不成立執行此處程式碼
    }
    
    

  • 執行邏輯

1.4 三元表示式

• 語法結構

  表示式1 ? 表示式2 : 表示式3;
  

• 執行思路

  • 如果表示式1的結果為 true ，則返回表示式2的值，如果表示式1為 false，則返回表示式3的值
  • 簡單理解： 就類似於 if else （雙分支） 的簡寫

switch 分支流程

• 語法結構

  switch 語句也是多分支語句，它用於基於不同的條件來執行不同的程式碼。當要針對變數設定一系列的特定值的選項時，就可以使用 switch。

 switch( 表示式 ){ 
    case value1:
        // 表示式 等於 value1 時要執行的程式碼
        break;
    case value2:
        // 表示式 等於 value2 時要執行的程式碼
        break;
    default:
        // 表示式 不等於任何一個 value 時要執行的程式碼
}

• 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語句的執行效率比較高，而且結構更清晰。