2-1 嚙踝蕭嚙踝蕭埻z

在條件敘述中，最常見的就是 if 敘述，其一般格式如下： If (condition) { … } 在上述格式中，若 condition 的值是 true 或非零，則執行大括號中的程式碼；反之，則不執行。若要在判斷條件不成立時，能夠執行另一段程式碼，則可用 if-else 敘述： If (condition) { statement 1 } else { statement 2 } 在上述格式中，若 condition 的值是 true 或非零，則執行 statement 1；反之，則執行 statement 2。如果在條件成立（或不成立）時，只需執行一個敘述，那就可以省略對應的大括號。例如：

Example（ifElse01.htm）：

上述範例可根據使用者輸入的年齡，而回應兩種不同諂媚的話，完整原始檔案如下：

原始檔（ifElse01.htm）：（灰色區域按兩下即可拷貝）
<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=big5">
</head>

<body>
<h2 align=center>if-else 敘述</h2>
<hr>

<script>
function flatter() {
	var age = prompt("請輸入您的年齡：", 30);
	if (age<30)
		alert("您只有 " + age + " 歲，真是青年才俊啊！");
	else
		alert("您年過30，想必是事業有成了！");
}
</script>
<a href="javascript:flatter()">諂媚的話</>

<hr>
</body>
</html>

若要進行多種條件的比對，則可以反覆使用 if-else 敘述，但是這樣會造成程式碼的雜亂，另一個比較好的方法，則是使用 switch 敘述，例如若要判斷今天是星期幾，並印出相關的訊息，可見下列範例：

Example（switch01.htm）：

上述範例的完整原始檔案如下：

原始檔（switch01.htm）：（灰色區域按兩下即可拷貝）
<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=big5">
</head>

<body>
<h2 align=center>switch 敘述</h2>
<hr>

<script>
today = new Date();	// 取得「今天」的物件
day = today.getDay();	// 取得今天是星期幾
switch (day) {
	case 0:
		document.write("<p>今天是星期天耶，可以睡到12點嘍！");
		break;
	case 1:
		document.write("<p>今天是星期一...GDIM...");
		break;
	case 2:
	case 3:
		document.write("<p>今天是星期二或三，離週末還很遠呢！繼續工作中...");
		break;
	case 4:
		document.write("<p>今天是星期四...星期五為什麼還沒到？");
		break;
	case 5:
		document.write("<p>今天是星期五喔，TGIF!");
		break;
	case 6:
		document.write("<p>今天星期六喔，誰要跟我去血拼？");
		break;
	default:
		document.write("<p>Error!");
}
</script>

<hr>
</body>
</html>

在上面的範例中，day 的值是從 0 到 6，分別代表星期日、星期一、星期二、...、星期六，因此我們可以使用 day 的值，來印出不同的訊息。需要注意的是，switch 會依序比對每一個 case 指令的條件，並在條件滿足後，執行相關的敘述。若需要在符合某個特定條件後就不再比對，此時就要在相關敘述最後面加上 break 敘述。此外，default 之後的敘述，只會在所有條件均不符合時，才會被執行。如果不加上 break，則系統會在符合某一個特定條件後，就執行符合下列其他條件的敘述，產生很奇怪的結果。下列範例和上一個範例完全相同，唯一差別是沒有 break，如下：

Example（switch02.htm）：

上述範例的完整原始檔案如下：

原始檔（switch02.htm）：（灰色區域按兩下即可拷貝）
<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=big5">
</head>

<body>
<h2 align=center>switch 敘述</h2>
<hr>

<script>
today = new Date();	// 取得「今天」的物件
day = today.getDay();	// 取得今天是星期幾
switch (day) {
	case 0:
		document.write("<p>今天是星期天耶，可以睡到12點嘍！");
		//break;
	case 1:
		document.write("<p>今天是星期一...GDIM (God damned it's Monday)...");
		//break;
	case 2:
	case 3:
		document.write("<p>今天是星期二或三，離週末還很遠呢！繼續工作中...");
		//break;
	case 4:
		document.write("<p>今天是星期四...星期五為什麼還沒到？");
		//break;
	case 5:
		document.write("<p>今天是星期五喔，TGIF (Thank God it's Friday) !");
		//break;
	case 6:
		document.write("<p>今天星期六喔，誰要跟我去血拼？");
		//break;
	default:
		document.write("<p>Error!");
}
</script>

<hr>
</body>
</html>

Hint
以上 switch 的行為，和 C/C++ 中的 switch 是完全相同的。

若是判斷條件較複雜，我們也可以使用「且」、「或」、「否定」等方式來產生複合條件，請見下表：

說明符號
且&&
或||
否定!

例如，若要判斷是否「a 大於零，或 b 和 c 均不小於零」，可用下列程式碼：

If ((a>0) || (!(b<0) && !(c<0))) { ... }

JScript 也支援隱含的條件形式，稱為條件運算子。首先我們必須將要測試的條件後面加上一個問號，同時也指定兩個選項，第一個用在條件成立時，另一個則用在條件不成立時，這兩個選項之間必須以一個冒號分隔開來，例如，下列範例可以印出現在時間是「上午」還是「下午」：

Example（implicitIf01.htm）：

上述範例的完整原始檔案如下：

原始檔（implicitIf01.htm）：（灰色區域按兩下即可拷貝）
<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=big5">
</head>

<body>
<h2 align=center>條件運算子</h2>
<hr>

<script>
today = new Date();	// 取得「今天」的物件
hour = today.getHours();	// 取得時數
minute = today.getMinutes();	// 取得分數
second = today.getSeconds();	// 取得秒數
prepand = (hour>=12)? "下午":"上午";	// 利用條件運算子來決定是「上午」或「下午」
hour = (hour>=12)? hour-12:hour;	// 利用條件運算子來改成12小時制
document.write("現在時間是"+prepand+hour+"點"+minute+"分"+second+"秒");
</script>

<hr>
</body>
</html>

在條件敘述中，JavaScript 如何判斷一個運算式是 true （真）或 false （偽）呢？其根據的原則如下：

  1. 當運算結果是一個數值時，若此數值等於 0，則是 false，否則就是 true。
  2. 當運算結果是一個字串時，若此字串等於空字串（""），則是 false，否則就是 true。
以下這些範例讓讀者自行參考及推想：

條件敘述判定結果
0false
5true
-3true
""false
"0"true
"00"true
"0.0"true

下列範例印出上述判斷條件的結果：

Example（testIf.htm）：

上述範例的完整原始檔案如下：

原始檔（testIf.htm）：（灰色區域按兩下即可拷貝）
<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=big5">
</head>

<body>
<h2 align=center>判斷條件的真偽</h2>
<hr>

<script>
condition=0;
document.write("<br>Condition=0 ===> "+(condition?true:false));
condition=5;
document.write("<br>Condition=5 ===> "+(condition?true:false));
condition=-3;
document.write("<br>Condition=-3 ===> "+(condition?true:false));
condition="";
document.write("<br>Condition=\"\" ===> "+(condition?true:false));
condition="0";
document.write("<br>Condition=\"0\" ===> "+(condition?true:false));
condition="00";
document.write("<br>Condition=\"00\" ===> "+(condition?true:false));
condition="0.0";
document.write("<br>Condition=\"0.0\" ===> "+(condition?true:false));
</script>

<hr>
</body>
</html>

JavaScript 程式設計與應用：用於網頁用戶端