04- JavaScript 流程控制語句:選擇結構(if和switch)

代碼塊

{}包圍起來的代碼,就是代碼塊。

JS中的代碼塊,只具有分組的作用,沒有其他的用途。

代碼塊中的內容,在外部是完全可見的。舉例:

  {
      var a = 2;
      alert("smyhvae");
      console.log("永不止步");
  }
  console.log("a = " + a);

打印結果:(可以看出,雖然變量 a 是定義在代碼塊中的,但是在外部依然可以訪問)

永不止步
a = 2

流程控制語句

在一個程序執行的過程中,各條語句的執行順序對程序的結果是有直接影響的。所以,我們必須清楚每條語句的執行流程。而且,很多時候我們要通過控制語句的執行順序來實現我們要完成的功能。

流程控制語句分類

  • 順序結構

  • 選擇結構:if語句、switch語句

  • 循環結構:while語句、for語句

順序結構

按照代碼的先後順序,依次執行。結構圖如下:

在這裏插入圖片描述

if語句

if語句有以下三種。

1、條件判斷語句

條件成立才執行。如果條件不成立,那就什麼都不做。

格式:

	if (條件表達式) {
		// 條件爲真時,做的事情
	}

2、條件分支語句

格式1:

	if (條件表達式) {
		// 條件爲真時,做的事情
	} else {
		// 條件爲假時,做的事情
	}

格式:(多分支的if語句)

	if (條件表達式1) {
		// 條件1爲真時,做的事情
	} else if (條件表達式2) {
		// 條件1不滿足,條件2滿足時,做的事情
	} else if (條件表達式3) {
		// 條件1、2不滿足,條件3滿足時,做的事情
	} else {
		// 條件1、2、3都不滿足時,做的事情
	}

以上所有的語句體中,只執行其中一個。

做個題目

	根據BMI(身體質量指數)顯示一個人的體型。
	BMI指數,就是體重、身高的一個計算公式。公式是:
	BMI =體重÷身高的平方

	比如,老師的體重是81.6公斤,身高是1.71米。
	那麼老師的BMI就是  81.6 ÷ 1.712     等於 27.906022365856163

	過輕:低於18.5
	正常:18.5-24.99999999
	過重:25-27.9999999
	肥胖:28-32
	非常肥胖, 高於32

	用JavaScript開發一個程序,讓用戶先輸入自己的體重,然後輸入自己的身高(彈出兩次prompt框)。
	計算它的BMI,根據上表,彈出用戶的身體情況。比如“過輕” 、 “正常” 、“過重” 、 “肥胖” 、“非常肥胖”。

答案

寫法1:

	//第一步,輸入身高和體重
	var height = parseFloat(prompt("請輸入身高,單位是米"));
	var weight = parseFloat(prompt("請輸入體重,單位是公斤"));
	//第二步,計算BMI指數
	var BMI = weight / Math.pow(height, 2);
	//第三步,if語句來判斷。注意跳樓現象
	if (BMI < 18.5) {
		alert("偏瘦");
	} else if (BMI < 25) {
		alert("正常");
	} else if (BMI < 28) {
		alert("過重");
	} else if (BMI <= 32) {
		alert("肥胖");
	} else {
		alert("非常肥胖");
	}

寫法2:

	//第一步,輸入身高和體重
	var height = parseFloat(prompt("請輸入身高,單位是米"));
	var weight = parseFloat(prompt("請輸入體重,單位是公斤"));
	//第二步,計算BMI指數
	var BMI = weight / Math.pow(height, 2);
	//第三步,if語句來判斷。注意跳樓現象
	if (BMI > 32) {
		alert("非常肥胖");
	} else if (BMI >= 28) {
		alert("肥胖");
	} else if (BMI >= 25) {
		alert("過重");
	} else if (BMI >= 18.5) {
		alert("正常")
	} else {
		alert("偏瘦");
	}

if語句的嵌套

我們通過下面這個例子來引出if語句的嵌套。

	一個加油站爲了鼓勵車主多加油,所以加的多有優惠。
	92號汽油,每升6元;如果大於等於20升,那麼每升5.9;
	97號汽油,每升7元;如果大於等於30升,那麼每升6.95
	編寫JS程序,用戶輸入自己的汽油編號,然後輸入自己加多少升,彈出價格。

在這裏插入圖片描述

代碼實現如下:

	//第一步,輸入
	var bianhao = parseInt(prompt("您想加什麼油?填寫92或者97"));
	var sheng = parseFloat(prompt("您想加多少升?"));

	//第二步,判斷
	if (bianhao == 92) {
		//編號是92的時候做的事情
		if (sheng >= 20) {
			var price = sheng * 5.9;
		} else {
			var price = sheng * 6;
		}
	} else if (bianhao == 97) {
		//編號是97的時候做的事情
		if (sheng >= 30) {
			var price = sheng * 6.95;
		} else {
			var price = sheng * 7;
		}
	} else {
		alert("對不起,沒有這個編號的汽油!");
	}
	alert("價格是" + price);

switch語句(條件分支語句)

switch語句也叫條件分支語句。

格式:

switch(表達式) {
	case 值1:
		語句體1;
		break;
	case 值2:
		語句體2;
		break;
	...
	...
	default:
		語句體 n+1;
		break;
}

switch語句的執行流程

流程圖如下:

在這裏插入圖片描述

執行流程如下:

(1)首先,計算出表達式的值,和case依次比較,一旦有對應的值,就會執行相應的語句,在執行的過程中,遇到break就會結束。

(2)然後,如果所有的case都和表達式的值不匹配,就會執行default語句體部分。

switch 語句的結束條件【非常重要】

  • 情況a:遇到break就結束,而不是遇到default就結束。(因爲break在此處的作用就是退出switch語句)

  • 情況b:執行到程序的末尾就結束。

我們來看下面的兩個例子就明白了。

case穿透的問題

switch 語句中的break可以省略,但一般不建議。否則結果可能不是你想要的,會出現一個現象:case穿透

舉例1:(case穿透的情況)

    var num = 4;

    //switch判斷語句
    switch (num) {
        case 1:
            console.log("星期一");
            break;
        case 2:
            console.log("星期二");
            break;
        case 3:
            console.log("星期三");
            break;
        case 4:
            console.log("星期四");
        //break;
        case 5:
            console.log("星期五");
        //break;
        case 6:
            console.log("星期六");
            break;
        case 7:
            console.log("星期日");
            break;
        default:
            console.log("你輸入的數據有誤");
            break;
    }

上方代碼的運行結果,可能會令你感到意外:

星期四
星期五
星期六

上方代碼的解釋:因爲在case 4和case 5中都沒有break,那語句走到case 6的break纔會停止。

舉例2

    //switch判斷語句
    var number = 5;

    switch (number) {
        default:
            console.log("我是defaul語句");
            // break;
        case (2):
          	console.log("第二個呵呵:" + number);
            //break;
        case (3):
          	console.log("第三個呵呵:" + number);
            break;
        case (4):
          	console.log("第四個呵呵:" + number);
            break;
    }

上方代碼的運行結果,你也許會意外:

我是defaul語句
第二個呵呵:5
第三個呵呵:5

上方代碼的解釋:代碼走到 default 時,因爲沒有遇到 break,所以會繼續往下走,直到遇見 break 或者走到程序的末尾。 從這個例子可以看出:switch 語句的結束與 default 的順序無關。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章