JS 條件句 (JS 教學) – 條件句在編碼上隨處可見. 程式編碼就是一堆分別判斷情況, 再提出行動指令的邏輯. if為邏輯的根本. 就好像一個人去計劃做一件事或對一件事作預備, 不可能無假設, 沒有如果這字眼, 不用if這字眼, 就無法把情況判斷, 分類, 也無沒寫程式. 總而言之, 學條件句為最基本而必要.
if為control flow 流程
- if為control flow 流程的必要元件, 即相當於人在思考時想”如果, 就這樣”的想法. 一個程式流可以由多個if條件句所形成. 用在分類上, 就好像水在樹底下自下而上流到葉, 如送信的機構, 會先把信送至一個國家的省總局, 再送至市, 再送至區, 再到確實的住處.
- if statement是只要滿足條件句, 就會實行block內的Code. 例如: 如果小孩作績一百分, 老師便自動發一個鼓勵message到學生Group內.
- 而Control Flow是一系列由if statement組成的邏輯. 產生的是為了應付現實世界的複雜. 例如銀行的Fraud Detection系統, 會根據一系列的資料, 如出有沒有可疑的資金來源, 有沒有異常入帳記錄等來決定. 估錯的問題很大. 如果經常有洗黑錢的資金流動而系統覺知不到, 日後被當地的執法機構查到, 罰金會很大, 例如某間國際銀行就因為這原因經常被西方國家罰款, 罰款以幾億到數十億元計. 反之, 如果帳戶沒有問題而系統認為他有問題而把他停戶, 就得失客人, 如果是大客戶, 問題就大了. (P.S. 這是舊式AI的做法)
- 另外, 我們寫System很多地方也會用都Control Flow, 例如:
- 系統讀取資料, 也需要一系列的 if 來過濾資料.
- 一定以Rule based為主而不能錯的邏輯, 例如交通燈的規劃(也是由邏輯組成).
if條件句之用法
- 一個條件句有三個元件, 一是variable, 二是比較項, 三是比較值(可為variable). 如 (x > 10), “x”為variable, “>”為比較邏輯, “10”為比較值, 其句意思為如果x大於10.
- 當中必須至少有一個variable, 因為variable可以使比較有一個當時的值, 才會作出有意義的比較.
- 如果不用variable, 用一個hardcode的值去比較, 如20 > 10, 20永遠比10大, 所以結果永遠true. (即(if(20>10) 是等如if (true))).
- 如果數值永遠為true, 那這句條件句根本多餘而不用寫, 因為這if的block必然會走, 直接寫block內的code就可以了.
- 如果永遠為false, 這code內的block永遠不會走, 所以條件句連同block內的code也可不用寫.
- 加上for loop, Array, Collection, Interface等, 混合應用可大大增強程序結構的簡潔, 並令Logic 可在Flow當中Block內重用.
- 如果情況固定, 如用在一個界定問題上, 條件句內只用一個variable, 及hardcode一個值是會比較好, 因為簡單直觀而容易看. 如現在温度如果過了20度就開冷氣, 很直接而容易理解.
- 如果用兩個variable, 就會比較抽象, 但會有相對的彈性. 如現在温度如果過了設定A的度就開冷氣(可以有設定B, 設定C, 這可能由於有不同的設定者, 情景). 這對初學者來說會有點困難, 但相信一段短時間就可以習慣.
而本篇暫時只以基礎介紹, 以下為一些例子顯示出 if 用法. Let’s Start!
| 條件句condition 即條件句數值的條件句大多如下: |
| i < 20 – 大於 i <= 20 – 大於及等如 i == 20 – 等如 i > 20 – 小於 i >= 20 – 小於及等如 |
| 句型 |
| <script type = “text/javascript”> if(condition){ // block of code to be executed if the condition is True } </script> |
| 例子 |
| <script type = “text/javascript”> if (isTrue == true){ // block of code to be executed if the condition is True } if (isTrue == false){ // block of code to be executed if the condition is True } </script> |
| 等如 |
| <script type = “text/javascript”> if (isTrue){ // block of code to be executed if the condition is True } if (!isTrue){ // block of code to be executed if the condition is True } </script> |
| <script type = “text/javascript”> if(condition 1){ // block of code to be executed if the condition is True } else if (condition 2) { // block of code to be executed if the condition is True } else { // block of code to be executed if the all other conditions is False } </script> |
| 如condition 1乎合條件, 行condition 1的block, 之後完結 如condition 1不乎合條件, 行condition 2, 若乎合條件, 行condition 2的block 如condition 2不乎合條件, 行else 的block, 完結 |
| 條件句加上 && (And) |
| <script type = “text/javascript”> bnIsUsed = true; bnIsSelling = true; if (bnIsUsed == true && bnIsSelling == true) { // block of code to be executed if the condition is True } </script> |
| 等如 |
| <script type = “text/javascript”> bnIsUsed = true; bnIsSelling = true; if (bnIsUsed && bnIsSelling) { // block of code to be executed if the condition is True } </script> |
| 等如 |
| <script type = “text/javascript”> bnIsUsed = true; bnIsSelling = true; if (bnIsUsed) { if (bnIsSelling) { // block of code to be executed if the condition is True } } </script> |
| 等如意思是説, 如果bnIsUsed 及 bnIsSelling都是true 的話, 就會行Block. |
相關頁面:
JS 迴圈 – Javascript For, For Each 迴圈的基礎用法
JS While – While 迴圈的基礎用法 – BLOCK內重用 JS Code
參考資料: https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Statements/if…else