JavaScript基础知识16—

JavaScript基础知识16——分支语句

news2024/12/20 17:54:40

哈喽，大家好，我是雷工。
今天学习JavaScript基础知识的分支语句，以下为学习笔记。

1、程序三大流程控制语句

○写几句就从上往下执行几句，这种叫做顺序结构；
○有时要根据条件选择执行代码，这种叫分支结构；
○某段代码被重复执行，就叫循环结构；

在这里插入图片描述

2、分支语句

○分支语句可以让我们有选择性的执行想要执行的代码
○分支语句包含：
→ if分支语句
→ 三元运算符
→ switch语句

2.1、if分支语句
● if语句有三种使用：单分支、双分支、多分支
● 单条件分支语句：程序如果执行的时候，如果条件成立就执行某一行代码，如果条件不成立则执行其他代码
使用语法：

if(条件)
{
    满足条件要执行的代码
}

▶ 小括号内的条件为true时，进入大括号里执行代码。
▶ 小括号内的结果若不是布尔类型时，会发生隐式转换转换为布尔类型。
▶ 如果大括号内只有一个语句，大括号可以省略，但是，一般不提倡这么做~

● 双分支if语法：

if(条件)
{
    满足条件要执行的代码
}
else
{
    不满足条件时要执行的代码
}

语法解释：
1>程序先判断if中的条件是否成立（true），如果条件成立，则执行if后面对应的代码，else中的代码不会执行。
2>如果if中的条件不成立（False），程序只执行else后{}中的代码，if后{}内的代码不会执行。

● 多条件分支语句if：
应用场景：当有多个结果的时候，比如学习成绩可以分为：优秀、良好、及格、不及格四个选项。
语法：

if(条件1)
{
    满足条件1要执行的代码1
}
else if(条件2)
{
    满足条件2要执行的代码2
}
else if(条件3)
{
    满足条件3要执行的代码3
}
else
{
    以上条件均不满足时执行代码n
}

语法说明：
▶ 先判断条件1，若满足条件1就执行代码1，其他代码统统不执行；
▶ 若不满足则按顺序向下判断条件2，满足条件2执行代码2，其他代码不执行；
▶ 若依然不满足继续往下判断，依次类推；
▶ 若以上条件都不满足，执行else里的代码n ；
▶ 注：可以根据实际需要写N个条件，但这里演示只写2个；

单条件分支语句和多条件分支语句总结：
a)不管是单条件分支语句，还是多条件分支语句，else都可以省略（前提else中没有代码）
b)条件分支语句，如果只有一行代码，则{}可以省略。
例：if(3>0)alert(“雷工笔记”);
c)分支语句可以相互嵌套。

2.2、三元表达式
就是单条件分支语句的另外一种写法

语法：
条件？代码1 ：代码2；
语法说明：
a)判断条件的真假，如果为真，则执行代码1，后面的代码2不执行；
b)如果条件不成立，则执行代码2，前面的代码1不执行；
● 一般用来取值
在这里插入图片描述

2.3、switch分支语句

switch 分支语句就是多条件分支语句的另外一种写法

语法：

switch(数据/变量)
{
    case  值1：
            代码1；
            break；
    
    case  值2：
            代码2；
            break；
  
    case  值3：
            代码3；
            break；
  
    default：
            代码n；
            break；
}

释义：
▶ 找到跟小括号里数据/变量全等的case值，并执行里面对应的代码
▶ 若没有全等 === 的则执行 default里面的代码
▶ 例：数据若跟值1全等，则执行代码1

注意事项：
1>. switch case语句一般用于等值判断,不适合于区间判断；
2>. switch case一般需要配合break关键字使用没有break会造成case穿透（default后面的break可以省略）；
3>.什么情况下使用switch语法？什么情况下使用多条件分支if语句？
a）在任何情况下都可以使用switch语句或者多条件分支语句；
b）如果变量的值是某些固定的值，推荐使用switch;
示例1：一年有12个月，1月-12月；
示例2：一年有4个季节，春，夏，秋，冬
c）如果变量的值是一个范围，推荐使用if多分支语句
示例：年龄在18-35岁之间。
4> switch 中变量的值和case后面的值必须是完全相等（数据类型和值都一样）
示例：

let num='1'
switch(数据/变量)
{
    case  1：
            alert('欢迎关注【李工笔记】')；
            break；
    
    case  10：
            alert('欢迎关注【王工笔记】')；
            break；
  
    default：
            alert('欢迎关注【雷工笔记】')；
            break；
}//结果：欢迎关注【雷工笔记】