前端学习手册-JavaScript条件判断语句全解析(十八)

一、if else语句:条件判断语句

条件判断语句是编程中常用的逻辑控制结构。它允许程序根据特定条件执行不同的操作。

例如,可以通过分数显示差异化内容,或基于布尔值判断操作成功与否。

javascript 复制代码
function calculateGrade(score) {
    if (score >= 90) return "A";
    else if (score >= 80) return "B";
    else if (score >= 70) return "C";
    else if (score >= 60) return "D";
    else return "F";
}

流程图如下:

if else if else 语句

在 if else if else 语 句中允许您定义多个条件表达式,并根据表达式的结果执⾏相应的代码,语法格式如下:

if (条件表达式 1) {

// 条件表达式 1 为真时执⾏的代码

} else if (条件表达式 2) {

// 条件表达式 2 为真时执⾏的代码

}

...

else if (条件表达式N) {

// 条件表达式 N 为真时执⾏的代码

} else {

// 所有条件表达式都为假时要执⾏的代码

}

提示:if else if else 语句在执⾏过程中,当遇到成⽴的条件表达式时,会⽴即执⾏其后 { } 中的代码,然后退出整个 if else if else 语句,若后续代码中还有成⽴的条件表达式,则不会执⾏。

注意事项:JavaScript 解释器将根据就近原则,使⽤嵌套 if else 时,如果只有⼀⾏语句,也应该使⽤⼤括号包裹起来,避免条件歧义。

二、switch case语句详解

switch case 语句和 if else 语句都能实现多分支结构,根据条件执行不同代码。相比 if else 结构,switch case 语句更简洁紧凑,执行效率更高。

javascript 复制代码
function calculateGrade(score) {
    // 计算十位数
    let tens = Math.floor(score / 10);
    
    switch(tens) {
        case 10:
        case 9:
            return "A";  // 90-100分
        case 8:
            return "B";  // 80-89分
        case 7:
            return "C";  // 70-79分
        case 6:
            return "D";  // 60-69分
        default:
            return "F";  // 0-59分
    }
}

流程图如下:

switch 语句通过将表达式与各个 case 子句的值进行严格比较(===)来执行分支判断:

当表达式值与 case 值匹配时:

1.执行对应的语句块

2.遇到 break 则立即退出整个 switch 结构

3.若省略 break,会继续执行后续 case 的语句(称为"case 穿透")

可选的 default 子句:

1.在所有 case 匹配失败时执行

2.不需要 break,因其位于结构末尾

重要特性:

1.使用严格相等比较,不进行类型转换

2.case 子句可省略语句实现条件穿透

3.在函数中使用时,可用 return 替代 break 退出

注意事项:

1.每个 case 只定义执行起点,需显式使用 break 定义终点

2.缺少 break 会导致逻辑错误,破坏预期的控制流

break 关键字

switch 语句会依次检查每个 case 条件,一旦找到匹配项,就会执行对应的代码块,并且会继续执行后续所有 case 语句。为了避免这种穿透现象,必须在每个 case 子句末尾使用 break 语句来终止 switch 执行。

此外,break 语句不仅可以用于跳出 switch 结构,还能用于中断各种循环语句(包括 for、for in、while 和 do while 等),具体用法将在后续详细介绍。

相关推荐
辣知22 分钟前
《辣知化智》天文星斗与华夏血脉
学习
大翻哥哥1 小时前
轻量级PHP网页在线客服系统 隐私聊天—— 可定制
开发语言·php
dear_bi_MyOnly8 小时前
【MyBatis 操作数据库】
java·数据库·学习·mybatis·学习方法
Wang's Blog8 小时前
Go-Zero 项目开发43:基于 Filebeat 收集各个服务的日志信息
开发语言·golang·go-zero·filebeat
一只小菜鸡..9 小时前
南京大学 操作系统 (JYY) 学习笔记:从 UNIX 到 Linux 与庞大的应用生态
笔记·学习·unix
丈剑走天涯9 小时前
JDK 17 正式特性
java·开发语言
东方小月9 小时前
从零开发一个 Coding Agent(四):使用状态机校验大模型事件流
前端·人工智能·后端
秋田君9 小时前
QT_QFontDialog类字体对话框
开发语言·qt
圣光SG9 小时前
Java操作题练习(七)
java·开发语言·算法
Csvn9 小时前
🧩 ESM vs CJS 混用的 7 个「天坑」——从 TypeScript 编译到 Node 与浏览器
前端