javascript基礎(控制流程(if,switch))(十一)
有程式碼編寫基礎的,自學時請略過
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>
相關文章
- Python基礎篇(流程控制)Python
- python – 流程控制基礎習題Python
- java基礎_05_流程控制Java
- Java基礎 - 流程控制語句Java
- Javascript 流程控制JavaScript
- 二.JS基礎-流程控制-xmind圖JS
- Go基礎系列:流程控制結構Go
- 【Java基礎知識】Java流程控制Java
- 零基礎學Java(6)控制流程Java
- 4、python基礎運算和流程控制Python
- python基礎之流程控制-day4Python
- Python基礎之:Python中的流程控制Python
- go 流程控制之switch 語句介紹Go
- 逆向基礎(十一)
- JavaScript3:流程控制JavaScript
- JavaScript 流程控制語句詳解:if語句、switch語句、while迴圈、for迴圈等JavaScriptWhile
- Java零基礎入門(三)流程控制Java
- Java核心基礎第3篇-Java流程控制Java
- Java基礎(十一)——反射Java反射
- 1.12 JavaScript3:流程控制JavaScript
- 流程控制與陣列—Java基礎學習(二)陣列Java
- JAVA基礎--Switch case語句Java
- Flutter 基礎控制元件篇-->單選框(Switch)、核取方塊(Checkbox)Flutter控制元件
- JavaScript statement flow control || JavaScript 語句流程控制JavaScript
- 《前端運維》一、Linux基礎--06Shell流程控制前端運維Linux
- Python4️⃣:0小白基礎之——流程控制專題Python
- JavaScript常用的流程控制語句JavaScript
- javascript基礎JavaScript
- Django基礎流程Django
- Python基礎(相關歷史、互動、簡單流程控制)Python
- 【重溫基礎】2.流程控制和錯誤處理
- JavaSE基礎知識分享(十一)Java
- JavaScript非同步流程控制的前世今生JavaScript非同步
- DRF基礎操作流程
- JavaScript基礎原理JavaScript
- Javascript基礎之-thisJavaScript
- JavaScript Promise(基礎)JavaScriptPromise
- JavaScript基礎8JavaScript
- JavaScript基礎2JavaScript