1. 教程
  2. JavaScript 教程
  3. JavaScript if... Else 語句

JavaScript if... Else 語句

Created: October-14, 2018

在本教程中，你將學習如何使用 if ... else ... else if 編寫 JavaScript 中的條件語句。

JavaScript 條件語句

與許多其他程式語言一樣，JavaScript 還允許你根據執行時邏輯或比較測試條件的結果編寫執行不同操作的程式碼。這意味著，你可以建立評估結果為 true 或 false 的條件，基於評估結果，你可以執行某些操作。

JavaScript 中有幾個條件語句可用於制定決策：

  • if 語句
  • if...else 語句
  • if...else if...else 語句
  • switch...case 語句

我們將在接下來的章節中詳細討論這些語句。

if 語句

if 語句用來僅當指定的條件評估為真執行程式碼塊。這是最簡單的 JavaScript 條件語句，可以寫成：

if (condition) { // Code to be executed }

以下示例將輸出 Have a nice weekend，如果當天是星期五的話：

var now = new Date();
var dayOfWeek = now.getDay(); // Sunday - Saturday : 0 - 6

if(dayOfWeek == 5) {
    alert("Have a nice weekend!");
}

if...else 語句

你可以通過在 if 語句中新增 else 語句來提供替代選擇，從而增強 JavaScript 程式的決策功能。 **

if...else 語句允許你如果指定的條件計算為真的話可以執行一個程式碼塊，如果計算結果為假的話，執行另一個程式碼塊。它可以這樣編寫：

if (condition) { 
    // Code to be executed if condition is true 
} else { 
    // Code to be executed if condition is false 
}

以下示例中的 JavaScript 程式碼將輸出 Have a nice weekend! 如果當天是星期五的話，否則它將輸出文字 Have a nice day!。

var now = new Date();
var dayOfWeek = now.getDay(); // Sunday - Saturday : 0 - 6

if(dayOfWeek == 5) {
    alert("Have a nice weekend!");
} else {
    alert("Have a nice day!");
}

if...else if...else 語句

if...else if...else 用來合併多個 if...else 語句。

if (condition1) { 
    // Code to be executed if condition1 is true 
} else if (condition2) { 
    // Code to be executed if the condition1 is false and condition2 is true 
} else { 
    // Code to be executed if both condition1 and condition2 are false 
}

以下示例將輸出 Have a nice weekend! 如果當天是星期五的話，輸出 Have a nice Sunday! 如果當天是星期天，否則它將輸出 Have a nice day!。

var now = new Date();
var dayOfWeek = now.getDay(); // Sunday - Saturday : 0 - 6

if(dayOfWeek == 5) {
    alert("Have a nice weekend!");
} else if(dayOfWeek == 0) {
    alert("Have a nice Sunday!");
} else {
    alert("Have a nice day!");
}

你將在下一章中瞭解 JavaScript switch-case 語句 。

三元運算子

三元運算子提供了編寫 if … else 語句的簡便方法。三元運算子由問號（?）符號表示，它需要三個運算元：要檢查的條件，ture 的結果和 false 的結果。它的基本語法是：

var result = (condition) ? value1 : value2

如果條件計算為 true，則返回 value1，否則返回 value2。要了解此運算子的工作原理，請考慮以下示例：

var userType;
var age = 21;
if(age < 18) {
    userType = 'Child';
} else {
    userType = 'Adult';
}
alert(userType); // Displays Adult

使用三元運算子可以以更緊湊的方式編寫相同的程式碼：

var age = 21;
var userType = age < 18 ? 'Child' : 'Adult';
alert(userType); // Displays Adult

正如你在上面的示例中所看到的，由於指定的條件計算為 false ，因此返回冒號（:） 右側的值，即字串 Adult。

提示： 使用三元運算子編寫的程式碼有時很難閱讀。但是，它提供了編寫緊湊的 if-else 語句的好方法。