JavaScript 判斷式

JavaScript

判斷式

用來作流程控制，當指定的條件成立時，就會執行某件事。

在 Javascript 中，有兩種判斷式的語法：

  • if…else

  • switch

什麼是流程控制？

流程控制定義就是程式執行的流程順序，和對應不同狀況而採取不同流程。

if…else

對於 if…else 而言，代表當如果符合什麼條件的情況下，

會做什麼事，除此之外…會做什麼事。

會以以下的形式：

1
2
3
4
5
if (條件){
    符合條件要做的事
}else{
    除此之外，要做的事
}

舉個例子：

1
2
3
4
5
6
const status = "good";
if (status == "sick") {
  console.log("take rest at home");
} else {
  console.log("go to school");
}

如果今天我生病了，我會留在家裡休息，如果不是，就會去學校上學。

我今天的狀況是好的，所以以上述的例子而言，我會去學校上課。

三元運算子

跟 if 條件判斷式很像，寫法是藉由一個條件後帶著問號，

在將符合條件要做的事以及不符合條件做的事中間以冒號做分隔。

語法：condition ? exprIfTrue : exprIfFalse

我們可以把上面的例子用，三元運算子來表達：

1
2
3
const status = "good";

status == "sick" ? "take rest at home" : "go to school";

if…else if… else…

對 if…else 而言，可能將情況二分法，

但對 if…else if… else…而言，

情況就不一定只有兩種，是兩種以上。

例如：

1
2
3
4
5
6
7
8
9
10
const status = "good";
if (status == "sick") {
  console.log("take rest at home");
} else if (status == "a little uncomfortable") {
  console.log("take half day");
} else if (status == "want to sleep") {
  console.log("take a nap for more ten minutes");
} else {
  console.log("go to school");
}

如果今天我生病了，我會留在家裡休息；

如果有點不舒服，會請半天假；

有點想睡，只能再睡 10 分鐘；

如果都不是，就會去學校上學。

我今天的狀況是好的，所以以上述的例子而言，我會去學校上課。

switch

對 switch 語法而言，會以 switch…case 以及 break 做搭配：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
switch (變數){
    case 條件1:
    符合條件1要做的事;
    break;
    case 條件2:
    符合條件2要做的事;
    break;

    ... //可能不止兩個條件

    [default:]
        //與其他條件都不符合，就以這個去執行
    [break;]
}

之前的例子：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
const status = "good";
switch (status) {
  case "sick":
    console.log("take rest at home");
    break;
  case "a little uncomfortable":
    console.log("take half day");
    break;
  case "want to sleep":
    console.log("take a nap for more ten minutes");
    break;

  default:
    console.log("go to school");
}

對於 default 而言，就是除了上述的情況以外，剩下的情況都要去上學。

參考資料:

MDN - if..else

MDN - 條件運算子

MDN - switch