JavaScript語法詳解:if語句&for循環&函數


本文首發於博客園,並在GitHub上持續更新前端的系列文章。歡迎在GitHub上關注我,一起入門和進階前端。

以下是正文。

if語句

最基本的if語句

if語句的結構體:(格式)

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

	} else {
		// 條件為假時,做的事情

	}

if語句也成為“選擇語句”、“條件判斷語句”。

多分支的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);

if語句的幾個小知識點

(1)else部分可以省略。例如:

		var a = 10;
		if(a > 20){
			alert("這個數字大於20");
		}

沒有else部分,則代表沒有“否則”。如果條件表達式不滿足了,那么就什么都不做。

(1)如果要做的事情只有一句話,那么大括號就可以省略。例如:

		var a = 2;
		if(a > 5) alert("這個數字大於5");
		alert("哈哈");

彈出的內容是“哈哈”。

for循環

for循環的結構

for循環舉例:

	for (var i = 1; i <= 100; i++) {
		console.log(i);
	}

上方代碼的解釋:

for循環遍歷

	for (var i = 1; i < 13; i = i + 4) {
		console.log(i);
	}

上方代碼的遍歷步驟:

程序一運行,將執行var i = 1;這條語句, 所以i的值是1。
然后程序會驗證一下i < 13是否滿足,1<13是真,所以執行一次循環體(就是大括號里面的語句)。
執行完循環體之后,會執行i=i+4這條語句,所以i的值,是5。

程序會會驗證一下i < 13是否滿足,5<13是真,所以執行一次循環體(就是大括號里面的語句)。
執行完循環體之后,會執行i=i+4這條語句,所以i的值,是9。

程序會會驗證一下i < 13是否滿足,9<13是真,所以執行一次循環體(就是大括號里面的語句)。
執行完循環體之后,會執行i=i+4這條語句,所以i的值,是13。

程序會會驗證一下i < 13是否滿足,13<13是假,所以不執行循環體了,將退出循環。

最終輸出輸出結果為:1、5、9

接下來做幾個題目。

題目1:

	for (var i = 1; i < 10; i = i + 3) {
		i = i + 1;
		console.log(i);
	}

輸出結果:2、6、10

題目2:

	for (var i = 1; i <= 10; i++) {

	}
	console.log(i);

輸出結果:11

題目3:

	for(var i = 1; i < 7; i = i + 3){

	}
	console.log(i);

輸出結果:7

題目4:

	for (var i = 1; i > 0; i++) {
		console.log(i);
	}

死循環。

算法題練習

暫略。

函數

函數:就是將一些語句進行封裝,然后通過調用的形式,執行這些語句。

函數的作用:

  • 將大量重復的語句寫在函數里,以后需要這些語句的時候,可以直接調用函數,避免重復勞動。

  • 簡化編程,讓編程模塊化。

先來看個例子:

	console.log("你好");
	sayHello();		//調用函數
	//定義函數:
	function sayHello(){
		console.log("歡迎");
		console.log("welcome");
	}

第一步:函數的定義

函數定義的語法:

	function 函數名字(){

	}

解釋如下:

  • function:是一個關鍵字。中文是“函數”、“功能”。

  • 函數名字:命名規定和變量的命名規定一樣。只能是字母、數字、下划線、美元符號,不能以數字開頭。

  • 參數:后面有一對小括號,里面是放參數用的。

  • 大括號里面,是這個函數的語句。

第二步:函數的調用

函數調用的語法:

	函數名字();

函數的參數:形參和實參

函數的參數包括形參和實參。來看下面的圖就懂了:

注意:實際參數和形式參數的個數,要相同。

舉例:

		sum(3,4);
		sum("3",4);
		sum("Hello","World");

		//函數:求和
		function sum(a, b) {
			console.log(a + b);
		}

控制台輸出結果:

	7
	34
	helloworld

函數的返回值

舉例:

		console.log(sum(3, 4));

		//函數:求和
		function sum(a, b) {
			return a + b;
		}

return的作用是結束方法。

我的公眾號

想學習代碼之外的軟技能?不妨關注我的微信公眾號:生命團隊(id:vitateam)。

掃一掃,你將發現另一個全新的世界,而這將是一場美麗的意外:


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM