失眠网 > Web前端开发笔记——第四章 JavaScript程序设计第四节条件语句和循环语句

Web前端开发笔记——第四章 JavaScript程序设计第四节条件语句和循环语句

时间：2020-02-29 00:52:20

一、if条件语句

在JavaScript中，if-else语句的格式如下：

if(表达式){语句1}else{语句2}

若要进行多个判断条件，可以通过if-else if-else语句，else-if可以为多个，当if里面的表达式1不成立时，执行表达式2，若表达式2不成立则执行语句3，格式如下：

if(表达式1){语句1}else if(表达式2){语句2}...else{语句3}

例如下列HTML代码，判断a的值然后通过alert()警告框输出a的值的判断情况，由于只有一条语句所以可以省略花括号，如下：

<!DOCTYPE html><html><head><meta charset="utf-8"><title></title></head><body><script type="text/javascript">var a = -2;if (a == 0)alert("a的值等于0!")else if (a < 0)alert("a的值小于0!")elsealert("a的值大于0!")</script></body></html>

运行结果如下：

二、while循环语句

（一）while()语句

while循环语句是while()条件表达式为正确时，则重复执行代码块中的内容，直到表达式为错误时退出程序，不再执行循环中的代码。

例如下列代码，通过while循环计算1+2+3+…+100的值，并在控制台中输出：

<!DOCTYPE html><html><head><meta charset="utf-8"><title></title></head><body><script type="text/javascript">var a = 1;var sum = 0;while (a <= 1000) {sum = a + sum;a+=1;}console.log("1+2+3+...+1000=",sum);</script></body></html>

运行结果如下：

（二）do……while语句

另外还有do……while语句，该循环在每次检查表达式是否成立之前都会执行一次代码块（即do……while语句至少执行一次），若表达式为成立则重复循环，直到表达式不成立时退出循环，格式如下：

例如下列代码，并在控制台中输出：

<!DOCTYPE html><html><head><meta charset="utf-8"><title></title></head><body><script type="text/javascript">var i = 0;do {i++;console.log(i);}while (i < 10)</script></body></html>

运行结果如下：

三、for循环语句

例如下列代码，利用for循环输出1!+2!+3!+……+10!的结果，直接让for循环执行10次，并在控制台中输出：

<!DOCTYPE html><html><head><meta charset="utf-8"><title>条件语句</title></head><body><script type="text/javascript">var i, j, sum;j = 1;sum = 0;for (i = 1; i <= 10; i++) {j *= i;sum += j;}console.log("1!+2!+3!+...+10!=",sum);</script></body></html>

运行结果如下：

另外，for循环语句中还有一个for…in循环语句，它用于枚举对象的属性，即循环遍历对象，例如下列代码，循环遍历number[]数组，并在控制台中输出：

<!DOCTYPE html><html><head><meta charset="utf-8"><title>条件语句</title></head><body><script type="text/javascript">var number = [0, 1, 2, 3, 4, 5];for (var i in number)console.log(number[i]);</script></body></html>

运行结果如下：

四、switch语句

例如下列代码，学生成绩为80分，判断该学生的成绩等级并在控制台中输出（60分以下不及格，60-70分为及格，70-80分为良好，80-100分为优秀），其中switch(true)表示与case中表达式与其成立时匹配：

<!DOCTYPE html><html><head><meta charset="utf-8"><title>条件语句</title></head><body><script type="text/javascript">var score = 80;switch (true){case score < 60:console.log("不及格！");break;case score >= 60 && score < 70:console.log("及格！");break;case score >= 70 && score < 80:console.log("良好！");break;default:console.log("优秀！");}</script></body></html>

运行结果如下：