JavaScript流程控制
流程控制-IF
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <script type="text/javascript"> var x = 1; if (x == 1) { var s = "今天星期一"; } else if (x == 2) { var s = "今天星期二"; } else if (x == 3) { var s = "今天星期三"; } else if (x == 4) { var s = "今天星期四"; } else if (x == 5) { var s = "今天星期五"; } else if (x == 6) { var s = "今天星期六"; } else if (x == 7) { var s = "今天星期日"; } else { var s = "你的输入有误"; } console.log(s); </script> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
流程控制,if语句单分支
if (条件判断语句) {
循环代码
}
单分支通过条件判断语句,如果结果为true就执行循环体内的代码。返回false就退出循环
双分支
if (条件判断语句) {
.......
}else{
........
}
双分支通过条件判断语句,如果结果为true就执行第一个段代码。返回false就执行else后面的代码
多分支
if (条件判断语句) {
......
}else if{
........
}else{
..........
}
多分支可以有多条条件判断,如果第一个条件返回true,则执行第一段代码。然后退出循环
第一个条件返回false,则继续向下执行第二条条件判断语句........如果所有条件都为false就执行else后面的代码
流程控制-Switch
对于if的多分支语法,也可以使用switch来实现
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <script type="text/javascript"> //使用 switch 重写上面小案例 switch (true) { case x == 1: var s = "今天星期一"; break; case x == 2: var s = "今天星期二"; break; case x == 3: var s = "今天星期三"; break; case x == 4: var s = "今天星期四"; break; case x == 5: var s = "今天星期五"; break; case x == 6: var s = "今天星期六"; break; case x == 7: var s = "今天星期日"; break; default: var s = "输入错误参数"; break; } console.log(s); </script> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
switch(true) {
case 条件判断;
执行代码;
break; 跳出循环
case 条件判断2;
执行代码;
break; 跳出循环
efault:
如果都返回false要执行的代码;
break;
}
JavaScript循环
for循环
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <script type="text/javascript"> //循环 // For循环 for ( x ; x <= 7; x++) { console.log("今天星期"+x+"<br>"+"<hr>"); } </script> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
for循环语句
for (初始化; 循环条件; 更新条件){
循环体
}
while循环
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <script type="text/javascript"> //使用 While 循环重写上面小案例 x = 1; while ( x<=7) { console.log("今天星期"+x+"<br>"+"<br>"); x++; } </script> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
while循环语句
while (条件判断) {
执行代码
i++; // 更新条件
}