javascript基礎（控制流程(if,switch)）（十一）

厚積薄發2017發表於2017-02-08
JavaScript

有程式碼編寫基礎的，自學時請略過

1.if語句：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			
			/*
			 	流程控制語句
			 		- JS中程式的執行順序是按照自上到下一行一行執行的
			 		- 我們可以通過流程控制語句，來改變程式執行的順序，
			 			或者讓某一段程式反覆執行多次
			 		- 流程控制語句的分類：
			 			1.條件判斷語句
			 			2.條件分支語法
			 			3.迴圈語句
			 	
			 * */
			
			/*
			 	條件判斷語句
			 		- 條件判斷語句也叫 if語句
			 		- 語法一：
			 			if(條件表示式) {
			 				語句...
			 			}
			 			
			 			
			 		- 執行流程：
			 			if語句在執行時，會先對條件表示式進行求值判斷，
			 				如果判斷結果為true，則執行if後的語句
			 				如果判斷結果為false，則不執行
			 		- if語句只對緊隨其後的那個語句其後的語句起作用,
			 			如果希望if語句可以控制多條語句，則可以將語句放到一個程式碼塊中,
			 			一般情況為了方便閱讀，即使if後僅有一條語句，我們也要加{}
			 		- 如果if後的條件表示式的結果不是布林值，則將其轉換為布林值然後在判斷	
			 			
			 * 
			 * */
			
			var a = 20;
			var b = 10;
			
			/*
			if(a > 15 && b < 20){
				alert("a比15大，b比20小");
			}
			*/
			
			/*if(a > 15 || b < 20){
				alert("a比15大，b比20小");
			}*/
			
			if(""){
				alert("你看我出來嗎？");
			}
				
			
			
			
			
		</script>
	</head>
	<body>
	</body>
</html>



<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			
			/*
			 	if語句，語法2:
			 		if...else...語句：
			 		
			 		if(條件表示式){
			 			語句...
			 		}else{
			 			語句...
			 		}
			 		
			 		執行流程：
			 			if...else...語句執行時，會先對if後的條件表示式進行求值判斷，
			 				如果判斷結果為true，則執行if後的語句
			 				如果判斷結果為false，則執行else後的語句
			 				
			 	語法3：
			 		if...else if...else...語句
			 		
			 		if(條件表示式){
			 			語句...
			 		}else if(條件表示式){
			 			語句...
			 		}else if(條件表示式){
			 			語句...
			 		}else if(條件表示式){
			 			語句...
			 		}else{
			 			語句...
			 		}
			 		
			 		執行流程：
			 			if...else if...else語句執行時,會從上到下依次對條件表示式進行求值判斷，
			 				如果遇到判斷結果為true的，則執行當前if後的語句，語句執行，直接結束不再判斷
			 				如果判斷結果為false時，則繼續向下判斷，直到找到為true的條件表示式為止
			 				如果所有的條件表示式都為false，則執行最後的else
			 				
			 			if...else if...else語句中只會有一個程式碼塊會執行，一旦條件判斷成立，
			 				則立即執行其後的程式碼塊，執行完成後立即退出，不再判斷其他條件
			 		
			 * */
			
			//建立一個變數
			var age = 69;
			
			//如果年齡大於等於60，則輸出你已經退休了
			/*if(age >= 60){
				alert("你已經退休了~~~~");
			}else{
				alert("你還沒退休~~~");
			}*/
			
			age = 65;
			
			/*if(age >= 80){
				alert("歲數不小了~~~");
			}else if(age >= 60){
				alert("你已經退休了~~~");
			}else if(age >= 30){
				alert("你已經中年了~~~");
			}else if(age >= 18){
				alert("你已經成年了~~~");
			}else{
				alert("你個小屁孩~~");
			}*/
			
			/*if(age >= 30){
				alert("哈哈哈");
			}*/
			
			age = 150;
			
			if(age >= 18 && age < 30){
				alert("你已經成年了");
			}else if(age >= 30 && age < 100){
				alert("你已經中年了");
			}else if(age >= 100){
				alert("你也老大不小了");
			}else{
				alert("你個小屁孩~~");
			}
			
		</script>
	</head>
	<body>
	</body>
</html>

練習： 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>if練習3</title>
		<script type="text/javascript">
			/*
			 * 	編寫程式，由鍵盤輸入三個數分別存入變數num1、num2、num3，
			 * 	對他們進行排序，並且從小到大輸出。
			 * 
			 */
			
			/*
			 * prompt()會將使用者輸入的內容作為返回值返回，
			 * 	注意：它返回的值的型別永遠都是String
			 */
			var num1 = +prompt("請輸入第一個數:");
			var num2 = +prompt("請輸入第二個數:");
			var num3 = +prompt("請輸入第三個數:");
			
			//alert(num1 +" , "+num2+" , "+num3);
			
			
			//10 > 2 //false
			//alert(num1 > num2);
			
			//將num1 轉換為number
			/* num1 = +num1;
			 * alert(typeof num1);
			 */
			
			//比較三個數字的大小，並排序
			//找出三個數中最大的那個變數
			if(num1 > num2 && num1 > num3){
				//進入判斷，則證明num1最大
				//比較num2和num3的關係
				if(num2 > num3){
					//num3 num2 num1
					alert(num3 + " , "+ num2 +" , "+ num1);
				}else{
					//num2 num3 num1
					alert(num2 + " , "+ num3 +" , "+ num1);
				}
				
			}else if(num2 > num1 && num2 > num3){
				//進入判斷則證明num2最大
				//比較num1和num3的關係
				if(num1 > num3){
					//num3 num1 num2
					alert(num3 + " , "+ num1 +" , "+ num2);
				}else{
					//num1 num3 num2
					alert(num1 + " , "+ num3 +" , "+ num2);
				}
				
			}else{
				//進入判斷則證明num3最大
				//比較num2和num1的關係
				if(num1 > num2){
					//num2 num1 num3
					alert(num2 + " , "+ num1 +" , "+ num3);
				}else{
					//num1 num2 num3
					alert(num1 + " , "+ num2 +" , "+ num3);
				}
				
			}
			
			
			
			
			
		</script>
	</head>
	<body>
		
	</body>
</html>

2.條件分支語句(switch語句): 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			
			/*
			 	條件分支語句(switch語句)
			 		- 語法
			 			switch(條件表示式){
			 				case 表示式:
			 					語句...
			 					break;
			 				case 表示式:
			 					語句...
			 					break;
			 				case 表示式:
			 					語句...
			 					break;
			 				default:
			 					語句...
			 					break;
			 			}
			 		- 執行流程：
			 			switch...case...語句在執行時，
			 				會將switch後的條件表示式自上向下一次和case後的表示式進行全等比較，
			 				如果全等則會執行當前case後的所有語句，可以在case的最後新增一個break關鍵字，來避免其他的case執行
			 				如果不全等，則繼續向下比較，直到找到全等的case為止，
			 				如果所有的case都不符合要求，則執行default後的語句
			 				
			 		- switch...case...語句的功能和if...else...功能類似，
			 			switch能幹的if也能幹，if能幹的switch也可以，他們是可以互相替換的，
			 			實際開發中習慣用哪個就用哪個，一般情況使用if比較多
			 			
			 
			 */
			
			
			//建立一個變數num
			var num = 1;
			
			/*
			 * 根據num的值，輸出對應的中文數字
			 * 1    壹
			 * 2    貳
			 * 3    叄
			 */
			/*if(num == 1){
				console.log("壹");
			}else if(num == 2){
				console.log("貳");
			}else if(num == 3){
				console.log("叄");
			}*/
			
			num = "abc";
			
			switch(num){
				case 1 :
					console.log("壹");
					//break可以用來退出switch語句
					//當break語句執行時，switch語句立即結束
					break;
				case 2 :
					console.log("貳");
					break;
				case 3 :
					console.log("叄");	
					break;
				case 4 :
					console.log("肆");	
					break;
				default :
					console.log("非法字元");
					break;
			}
			
			
		</script>
	</head>
	<body>
	</body>
</html>



相關文章