javaScript:分支语句的理解与使用(附带案例)

目录

前言

补充

另一种说法 

分支语句

1.if语句 

a.单分支语句

注意 

b.双分支语句 

注意点 

c.多分支语句(分支语句的联级语句) 

补充 

 2.三元运算符

三元运算符 ? :

使用场景

3.switch语句

解释

释义:

注意事项:

相关代码 

案例 

1.在input框输入两个数字判断大小

效果图 

代码 

2.判断闰年

效果图

代码 

3.判断成绩 

效果图

代码 


前言

        分支语句是编程中常用的一种控制结构,它允许根据条件的不同执行不同的代码。通过合理运用分支语句,可以根据不同的条件执自己行不同的代码,实现更精确的控制流程。在实际编程中,我们可以根据需求选择适当的分支语句来解决问题。  

补充

• 程序三大流程控制语句

1. 顺序结构

2.分支结构

3.循环结构

另一种说法 

程序结构

1.基本结构(顺序执行)

2.分支结构(分支语句)

3.循环结构(循环语句)

分支语句

分支语句主要包括以下三种,接下来我将对下面三种分支语句进行讲解。

a.if语句           (if语句分为单分支,双分支,多分支)

b.三元运算符  (简化版的分支语句)

c.switch语句   (switch是开关的意思)

1.if语句 

a.单分支语句

if(判断条件){
    只有当if中的判断条件为true的时候,{}中的代码才会被执行,如果判断
    条件不为true,则跳过{}中的代码,程序继续往下执行
}

注意 

       if后面()中的判断条件,不管里面的表达式有多复杂,返回的值永远只有true

或者false。括号内的条件为true时,进入大括号里执行代码 。   小括号内的结果若不是布尔类型时,会发生隐式转化为布尔类型。     如果大括号只有一个语句,大括号可以省略,但是,不提倡这么做~(虽然可以在if语句中省略大括号,但这样做可能会导致代码可读性和维护性的问题。特别是当if语句后面紧跟着一个缩进的代码块时,如果没有大括号明确定义代码块的范围,可能会引发错误。为了代码的一致性和可读性,建议始终使用大括号,即使代码块中只有一条语句。)

b.双分支语句 

if(判断条件){
    如果判断条件 为true,则执行这里的代码
}else{
    如果判断条件 不为true,则执行else中的代码
}

注意点 

       if 可以单独使用,else必须结合if一起使用。else指的是除了满足if条件

之外的所有条件。只有一行的时候可以转成三元,多行不行,建议只有一行的时候转化为三元

c.多分支语句(分支语句的联级语句) 

         在使用if语句的时候,else的范围有时候会比较大,因此可以使用else if,对具体的情况进行细分,else if 可以根据情况设置多个。使用场景:适合于有多个结果的时候,比如学习成绩可以分为; 优良中差

if(判断条件){
    执行语句
}slse if(判断条件){
    执行语句
}else{
    执行语句
}

补充 

注意

   1.当你书写判断条件的时候,注意等于是 == 不是 = , = 是赋值

   2.0 '' null  undefind 如果写在判断条件中,都被解析为false

   非0 , 非''  非null 非 undefined 如果写在判断条件中,都被解析为true

 2.三元运算符

三元运算符 ? :

判断条件判断条件为真,则执行当前代码判断条件为假,则执行当前代码

使用场景

使用场景:其实比if双分支更简单的写法,可以使用三元表达式 。 一般用来取值。

 

3.switch语句

        switch语句,特点是,默认贯穿整个结构,可以使用关键字break阻止贯穿,break的作用是阻断当前结构语句,可以阻断switch 也可以阻断 循环

 switch (数据) {
    case 值1:
        代码1
        break;
    case 值2:
        代码2
       break;
    default:
        代码n
        break;
  }

解释

释义:

1,找到跟小括号里数据全等的case值,并执行里面对应的代码。

2,若没有全等=== 的则执行default里的代码。 列:数据若根值2全等,则执行代码2      

注意事项:

1.switch case 语句一般用于等值判断,不适合用于区间判断     

 2.switch cass 一般需要配合break关键字使用,没有break会造成case穿透。

相关代码 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>switch语句</title>
</head>
<body>
    
</body>
</html>
<script>
    /*
    switch语句,特点是,默认贯穿整个结构,可以使用关键字break阻止贯穿
    break的作用是阻断当前结构语句,可以阻断switch 也可以阻断 循环
    */ 
   let count = 70;
    switch (count) {
        case 30:
            console.log('天涯何处无芳草');
            break;  //阻断switch语句,跳出switch
        case 170:
            console.log('一曲肝肠断');
            break;
            // default: 是默认的意思,如果上面的条件都不能执行则会执行default中的代码
        default:
            console.log('只因你太美+default');
            break;
    }

    let num = 1;

    switch (num) {
        case 1:
           console.log('当前是1');
           num+=10
           console.log(num);
          
           case 2:
            console.log('当前是2');
            num++
            console.log(num);
            break;
        default:
            num--
            console.log('当前是default');
            console.log(num);
            break;
            
    }
</script>

案例 

1.在input框输入两个数字判断大小

效果图 

代码 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>案例</title>
</head>
<body>
    数据1:  <input type="number" value="" id="a" > <br>
  数据2:  <input type="number" value="" id="b"> <br>
  <button id="bth">比较大小</button>
  <hr>
</body>
</html>
<script>
    let a = document.getElementById('a')
    let b = document.getElementById('b')
    let bth = document.getElementById('bth')
    bth.onclick = function(){
        let num1= a.value - 0
        let num2= b.value - 0
        // num1>num2? alert(num1):alert(num2)
         if (num1>num2) {
            alert(num1)
         }else if(num2==num1){
            alert('相等')
        }else{
            alert(num2)
        }
    }
</script>

2.判断闰年

效果图

 

代码 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>if语句练习</title>
</head>
<body>
  输入年份:<input type="number" value="" id="year" > <br>
  <button id="bth2">查看是否是润年</button>
</body>
</html>
<script>
    let year = document.getElementById('year')
    let bth2 = document.getElementById('bth2')
    bth2.onclick = function(){
        let n = year.value - 0
        if (n % 4 == 0 && n % 100 > 0 ||n % 400 == 0) {
            alert(n+'是闰年')
        }else{
            alert(n+'是平年')
        }
    }
</script>

3.判断成绩 

效果图

 

 

 

代码 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>if语句练习</title>
</head>
<body>
</body>
</html>
<script>
    let f = +prompt('输入考试成绩')
   if (f == 100) {
     alert('恭喜你的成绩为满分,奖励一个对象')
   }else if (f>=90) {
       alert('优秀')
   }else if(f>=80){
       alert('良好')
   }else if(f>=70){
       alert('中等')
   }else if(f>=60){
       alert('及格')
   }else{
      alert('开除学籍')
   }
</script>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/68453.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

将本地项目上传至gitee的详细步骤

将本地项目上传至gitee的详细步骤 1.在gitee上创建以自己项目名称命名的空项目2.进入想上传的项目的文件夹&#xff0c;然后右键点击3. 初始化本地环境&#xff0c;把该项目变成可被git管理的仓库4.添加该项目下的所有文件5.使用如下命令将文件添加到仓库中去6.将本地代码库与远…

最小生成树—Kruskal算法

什么是最小生成树&#xff1f; 首先&#xff0c;最小生成树一定数无向图&#xff0c;并且在不影响所有点都连通的情况下&#xff0c;所有边的权重加起来最小值是多少。 比如说&#xff1a;无向图abcp如下图所示&#xff0c;每条边权重也标记出来了。最小生成树就如右侧所示。 …

ModaHub魔搭社区——Milvus Cloud向量数据库

向量数据库:在AI时代的快速发展与应用 摘要: 随着人工智能技术的不断进步,向量数据库在处理大规模数据方面发挥着越来越重要的作用。本文介绍了向量数据库的基本概念、应用场景和技术挑战,并详细阐述了Milvus Cloud作为典型的向量数据库产品的技术特点、性能优化和应用案例…

yolov5的报错

【定期水一期】 &#xff08;这个问题很抓马&#xff0c;可以看一下这篇文章&#xff1a;Git Bash 教程&#xff01;【不是所有人都会用Git】&#xff09; 一&#xff1a;没有cv2这个模块 解决方案&#xff1a; pip install opencv-python -i http://pypi.douban.com/simple/…

内网穿透实战应用-配置固定的远程桌面地址【内网穿透、无需公网IP】

配置固定的远程桌面地址【内网穿透、无需公网IP】 文章目录 配置固定的远程桌面地址【内网穿透、无需公网IP】第一步&#xff1a;保留TCP地址第二步&#xff1a;为远程桌面隧道配置固定的TCP地址第三步&#xff1a;使用固定TCP地址远程桌面 使用免费的cpolar生成的远程桌面公网…

【计算机组成原理】24王道考研笔记——第三章 存储系统

第三章 存储系统 一、存储系统概述 现代计算机的结构&#xff1a; 1.存储器的层次结构 2.存储器的分类 按层次&#xff1a; 按介质&#xff1a; 按存储方式&#xff1a; 按信息的可更改性&#xff1a; 按信息的可保存性&#xff1a; 3.存储器的性能指标 二、主存储器 1.基本…

STM32 F103C8T6学习笔记3:串口配置—串口收发—自定义Printf函数

今日学习使用STM32 C8T6的串口&#xff0c;我们在经过学习笔记2的总结归纳可知&#xff0c;STM32 C8T6最小系统板上有三路串口&#xff0c;如下图&#xff1a; 今日我们就着手学习如何配置开通这些串口进行收发&#xff0c;这里不讲串口通信概念与基础&#xff0c;可以自行网上…

连续两年增收不增利,比亚迪电子靠新能源汽车业务再次起飞?

在净利润连续两年下挫之后&#xff0c;比亚迪电子&#xff08;00285.HK&#xff09;终于迎来了好消息。 不久前比亚迪电子发布2023年中期盈利预告显示&#xff0c;上半年净利润同比增加115%-146%&#xff08;2022年上半年的净利润显示6.34亿元&#xff09;。 这主要受益于大客…

vue+springboot基于web的火车高铁铁路订票管理系统

铁路订票管理系统按照权限的类型进行划分&#xff0c;分为用户和管理员两个模块。管理员模块主要针对整个系统的管理进行设计&#xff0c;提高了管理的效率和标准。主要功能包括个人中心、用户管理、火车类型管理、火车信息管理、车票预订管理、车票退票管理、系统管理等&#…

【Rust】Rust学习 第八章常见集合

Rust 标准库中包含一系列被称为 集合&#xff08;collections&#xff09;的非常有用的数据结构。大部分其他数据类型都代表一个特定的值&#xff0c;不过集合可以包含多个值。不同于内建的数组和元组类型&#xff0c;这些集合指向的数据是储存在堆上的&#xff0c;这意味着数据…

Spring Initailizr--快速入门--SpringBoot的选择

&#x1f600;前言 本篇博文是关于IDEA使用Spring Initializer快速创建Spring Boot项目的说明&#xff0c;希望能够帮助到您&#x1f60a; &#x1f3e0;个人主页&#xff1a;晨犀主页 &#x1f9d1;个人简介&#xff1a;大家好&#xff0c;我是晨犀&#xff0c;希望我的文章可…

AES加密(1):AES基础知识和计算过程

从产品代码的安全角度考虑&#xff0c;我们需要对代码、数据进行加密。加密的算法有很多种&#xff0c;基于速度考虑&#xff0c;我们一般使用对称加密算法&#xff0c;其中有一种常见的对称加密算法&#xff1a;AES(Advanced Encryption Standard)。在一些高端的MCU&#xff0…

为什么DNS协议运行在UDP之上?

DNS (Domain Name System) 运行在 UDP (User Datagram Protocol) 上主要是出于以下原因&#xff1a; 简单性和效率&#xff1a;UDP 是无连接的&#xff0c;这意味着与建立和维护 TCP 连接相比&#xff0c;UDP 有更少的开销。当 DNS 查询被发送时&#xff0c;它只需要一个小的请…

试图将更改推送到 GitHub,但是远程仓库已经包含了您本地没有的工作(可能是其他人提交的修改)

这通常是由于其他人或其他仓库推送到了相同的分支上&#xff0c;导致您的本地仓库和远程仓库之间存在冲突。 错误信息&#xff1a; To github.com:8upersaiyan/CKmuduo.git ! [rejected] main -> main (fetch first) error: failed to push some refs to github.com:8upers…

深入解析搜好货API:开启智能化电商解决方案

随着电商行业的快速发展&#xff0c;人们对于个性化、智能化的购物体验的追求也越来越高。为了满足消费者的需求&#xff0c;搜好货API应运而生。 一、搜好货API的基本原理 搜好货API基于先进的数据挖掘和机器学习算法&#xff0c;通过收集和分析大量的商品信息和用户行为数据…

利用Simulink Test进行模型单元测试 - 1

1.搭建用于测试的简单模型 随手搭建了一个demo模型MilTestModel&#xff0c;模型中不带参数 2.创建测试框架 1.模型空白处右击 测试框架 > 为‘MilTestModel’创建 菜单 2.在创建测试框架对话框中&#xff0c;点击OK&#xff0c;对应的测试框架MilTestMode_Harness1就自动…

【jvm】jvm整体结构(hotspot)

目录 一、说明二、java代码的执行流程三、jvm的架构模型3.1 基于栈式架构的特点3.2 基于寄存器架构的特点 一、说明 1.hotspot vm是目前市场上高性能虚拟机的代表作之一 2.hotspot采用解释器与即时编译器并存的架构 3.java虚拟机是用来解释运行字节码文件的&#xff0c;入口是字…

HTML5 中新增了哪些表单元素?

聚沙成塔每天进步一点点 ⭐ 专栏简介⭐ HTML5 中新增了的表单元素⭐ 写在最后 ⭐ 专栏简介 前端入门之旅&#xff1a;探索Web开发的奇妙世界 记得点击上方或者右侧链接订阅本专栏哦 几何带你启航前端之旅 欢迎来到前端入门之旅&#xff01;这个专栏是为那些对Web开发感兴趣、刚…

Clickhouse 存储引擎

一、常用存储引擎分类 1.1 ReplacingMergeTree 这个引擎是在 MergeTree 的基础上&#xff0c;添加了”处理重复数据”的功能&#xff0c;该引擎和MergeTree的不同之处在于它会删除具有相同主键的重复项。 特点: 1使用ORDERBY排序键作为判断重复的唯一键 2.数据的去重只会在合并…

基于 CentOS 7 构建 LVS-DR 群集

文章目录 前言1、LVS集群2、DR模式的工作流程图 一、LVS DR模式的配置二、配置步骤总结 前言 什么是LVS集群&#xff1f;DR模式&#xff1f; 1、LVS集群 LVS采用的是合入内核模块&#xff0c;先把对于nginx来说要稳定很多&#xff0c;性能和稳定都在一定层度上占据优势&…