前端学习手册-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 等),具体用法将在后续详细介绍。

相关推荐
_院长大人_4 小时前
Vue + ECharts 实现价格趋势分析图
前端·vue.js·echarts
疯笔码良4 小时前
【Vue】自适应布局
javascript·vue.js·css3
لا معنى له4 小时前
Var-JEPA:联合嵌入预测架构的变分形式 —— 连接预测式与生成式自监督学习 ----论文翻译
人工智能·笔记·学习·语言模型
世人万千丶4 小时前
Flutter 框架跨平台鸿蒙开发 - 宠物语言翻译器应用
学习·flutter·华为·开源·harmonyos·鸿蒙
浩星4 小时前
electron系列2:搭建专业Electron开发环境
javascript·typescript·electron
AI成长日志4 小时前
【笔面试算法学习专栏】哈希表基础:两数之和与字母异位词分组
学习·算法·面试
2501_933329554 小时前
企业媒体发布与舆情管理实战:Infoseek舆情系统技术架构与落地解析
大数据·开发语言·人工智能·数据库开发
"菠萝"4 小时前
C#知识学习-021(文字关键字)
开发语言·学习·c#
minji...4 小时前
Linux 线程同步与互斥(二) 线程同步,条件变量,pthread_cond_init/wait/signal/broadcast
linux·运维·开发语言·jvm·数据结构·c++
zhangzeyuaaa4 小时前
Python 中的 Map 和 Reduce 详解
开发语言·python