JavaScript if...else...

JavaScript if else 是 JavaScript 的條件判斷式,跟許多其他程式語言類似,if else 是最基本的條件判斷式,而且是 JavaScript 內建的基本功能,不需額外安裝即可直接調用,if else 會根據設計師設定的條件判斷執行項目,且條件可以設定為運算式,如果條件很多,可以使用 else if 增加判斷項目,判斷的處理順序根據每個條件的先後順序。除了直接在一般程式中調用,也可以在 JavaScript Loop 中調用,做為迴圈內的條件判斷,JavaScript if else 可以有以下幾種寫法:
  1. if...
  2. if...else...
  3. if...else if...else...
這三種基本語法用起來並不困難,以下各準備了一個簡易範例供參考。

JavaScript if 條件判斷範例
<script type="text/javascript">
var Str = "A";
if(Str == "A"){
 document.write("String is A.");
}
</script>
以上範例輸出:String is A.

這可以算是最簡單的條件判斷,一開始先準備一個變數 Str,並給變數值 A,然後用 if 來判斷如果變數 Str 的值是 A,就輸出結果,這裡有幾個小細節要注意,首先是 if 的條件判斷小括號內,Str == A 這裡必須寫雙等號,才算是條件判斷,如果寫成 Str=A 的條件,JavaScript 會以為你要把變數 Str 的值設定為 A,那 if 會完全的認為條件符合規定,直接執行 if 內的程式碼。

JavaScript if...else 條件判斷範例
<script type="text/javascript">
var Str = "B";
if(Str == "A"){
 document.write("String is A.");
}else{
 document.write("String is B.");
}
</script>
以上範例輸出:String is B.

這個範例是第一個範例的延伸,修改了變數 Str 的值並加上了 else 的功能,第一個 if 條件判斷變數 Str 並非 A,所以就執行 else 的程式碼,else 並不會管你的條件是什麼,只要前面的判斷都不符合,那就會執行 else 內的 code,所以 else 不需要使用小括號加條件。

JavaScript if...else if...else... 條件判斷範例
<script type="text/javascript">
var Str = "B";
if(Str == "A"){
    document.write("String is A.");
}else if(Str == "B"){
    document.write("String is B.");
}else{
    document.write("String is C.");
}
</script>
以上範例輸出:String is B.

範例再度延伸,這次加上了 else if 的判斷項目,請注意 JavaScript 中的 else if 寫法是兩個字母分開,與 PHP 的 elseif 連在一起寫不一樣,這是許多會寫 PHP 的設計師,剛開始接觸 JavaScript 時很容易忽略的地方。此段範例在第二輪判斷,也就是 else if 時就已經判斷出結果,並直接輸出結果,所以並不會執行最後 else 的程式碼。

備註:僅管 if else 的條件判斷相當好用,但需注意在設定條件時,不要太過複雜,且盡量避免在同一個程式中使用大量的 if else if else 條件,避免 client 端的處理消耗大量資源,瀏覽器處理 if else if else 是需要用資源的,不過運氣不錯的是,現在的電腦機器能夠處理比較大量的程序。

推薦給您的相關主題
© Copyright wibibi.com 網頁設計教學百科 基礎的網頁設計規劃、資料庫與程式設計 Since 2012
PHP Smarty MySQL JQuery Apache W3C