一、if分支语句
1.单分支if语句
if
(
条件
) {
满足条件后执行的逻辑代码
;
}
举例说明:
用户输入年成绩,如果年龄大于
18
,则提示恭喜你已经成年
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
let age = +prompt("请输入年龄")
if (age >= 18) {
alert("恭喜你成年了")
}
</script>
</body>
</html>
2.双分支if语句
if
(
条件
) {
满足条件后执行的逻辑代码
;
}
else{
}
举例:
用户输入,如果工龄大于
1
年,年底奖金
+2000
, 否则年底没奖金
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
/* 需求一 */
let number1 = +prompt("输入工龄")
if (number1 > 1) {
alert("年底奖金+2000")
} else {
alert("没奖金")
}
</script>
</body>
</html>
3.多分支if语句
if
(
条件
) {
满足条件后执行的逻辑代码
;
}
else if(
条件){
满足条件后执行的逻辑代码
;
}
else if(
条件){
满足条件后执行的逻辑代码
;
}
举例:
需求:根据输入不同时间,输出不同的问候语
12
点以前, 输出上午好
18
点以前, 输出下午好
20
点以前, 输出晚上好
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
let time = +prompt("请输入时间")
if (time < 12) {
alert("上午好")
}
else if (12 <= time < 16) {
alert("上午好")
}
else if (16 <= time < 20) {
alert("晚上好")
}
</script>
</body>
</html>
二、swich分支
(1)语法结构
switch
语句也是多分支语句,它用于基于不同的条件来执行不同的代码。当要针对变量设置一系列的特定值的选项时,就可以使用 switch
。
switch(
表达式
){
case value1:
//
表达式 等于
value1
时要执行的代码
break;
case value2:
//
表达式 等于
value2
时要执行的代码
break;
default:
//
表达式 不等于任何一个
value
时要执行的代码
}
举例:用户在弹出框里面输入一个水果,如果有就弹出该水果的价格, 如果没有该水果就弹出
“
没有此水果
”
。
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
let str = prompt("输入水果")
switch (str) {
case "西瓜":
alert(1)
break;
case "香蕉":
alert(2)
break;
case "苹果":
alert(3)
break;
case "橙子":
alert(4)
break;
default:
alert("无水果")
}
</script>
</body>
</html>
三、 if分支语句与swich分支语句的区别
1. 一般情况下,它们两个语句可以相互替换
2.switch...case
语句通常处理
case
为比较确定值的情况, 而
if…else…
语句更加灵活,常用于范围判断 (大于、等于某个范围
)
3.switch
语句进行条件判断后直接执行到程序的条件语句,效率更高。而
if…else
语句有几种事件就得判断多少次。
4.当分支比较少时,
if… else
语句的执行效率比
switch
语句高。
5. 当分支比较多时,
switch
语句的执行效率比较高,而且结构更清晰。