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

这篇具有很好参考价值的文章主要介绍了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双分支更简单的写法,可以使用三元表达式 。 一般用来取值。

javaScript:分支语句的理解与使用(附带案例),javascript,javascript,开发语言,ecmascript

 文章来源地址https://www.toymoban.com/news/detail-639606.html

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框输入两个数字判断大小

效果图 

javaScript:分支语句的理解与使用(附带案例),javascript,javascript,开发语言,ecmascript

代码 

<!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.判断闰年

效果图

javaScript:分支语句的理解与使用(附带案例),javascript,javascript,开发语言,ecmascript

 

代码 

<!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.判断成绩 

效果图

javaScript:分支语句的理解与使用(附带案例),javascript,javascript,开发语言,ecmascript 

 

javaScript:分支语句的理解与使用(附带案例),javascript,javascript,开发语言,ecmascript

 

代码 

<!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>

到了这里,关于javaScript:分支语句的理解与使用(附带案例)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 【JavaScript】案例1:使用JS完成注册页面校验

    🔎这里是【JavaScript】,关注我学习前端不迷路 👍如果对你有帮助,给博主一个免费的点赞以示鼓励 欢迎各位🔎点赞👍评论收藏⭐️ 【JavaScript】 目前主要更新JavaScript,一起学习一起进步。 本期主要介绍案例1:使用JS完成注册页面校验 1. 需求说明 2. 知识讲解-JavaScript(

    2024年02月06日
    浏览(44)
  • 分别用JavaScript,Java,PHP,C++实现桶排序的算法(附带源码)

    桶排序是计数排序的升级版。它利用了函数的映射关系,高效与否的关键就在于这个映射函数的确定。为了使桶排序更加高效,我们需要做到这两点: 在额外空间充足的情况下,尽量增大桶的数量 使用的映射函数能够将输入的 N 个数据均匀的分配到 K 个桶中 同时,对于桶中

    2024年02月22日
    浏览(47)
  • JavaScript 其他循环语句和跳转语句

    一、while语句 While 循环会在指定条件为真时循环执行代码块。 While循环,先进行条件判断,再执行循环体的代码 如果条件不满足,则不会执行循环体,一次都不会 案例: 二、do.....while循环 do/while 循环是 while 循环的变体。该循环会执行一次代码块,在检查条件是否为真之前

    2024年02月06日
    浏览(36)
  • JavaScript如何执行语句

    目录 语法/词法分析 预编译 解释执行 预编译什么时候发生 js运行三步曲 预编译前奏 预编译步骤 巩固基础练习 编译原理中的词法分析和语法分析是编译过程中的两个基本阶段。它们的区别如下: 1. 词法分析:词法分析阶段负责将源代码按照字符序列划分成一个个的词法单元

    2024年02月12日
    浏览(44)
  • JavaScript语句(七)

    1、条件语句 名称 描述 if 当指定条件为 true 时,执行 if 语句对应的代码 if…else 当条件为 true 时,执行 if 语句对应的代码 当条件为 false 时,执行 else 语句对应的代码 if…else if… 满足条件时,执行它所对应的代码 case 在 switch 中使用,表示要匹配的每一种情况 default 在 swi

    2024年02月08日
    浏览(36)
  • 值得收藏的JavaScript 语句

    有些时候,在创建对象时,希望根据特定的条件或变量更改对象的属性名,就可以借助方括号 [] 。 为变量设置默认值,避免无法处理的数据出现异常。 缩短数组的简单方法是重新定义它的长度属性,不过这样会更改数组,意味着将丢失数组中其他值。

    2024年02月07日
    浏览(40)
  • 7 JavaScript循环语句

    7 循环语句 在js中有三种循环语句. 首先是while循环. 它的逻辑和咱们python中的while几乎一模一样, 就是符号上有些许的区别.

    2024年02月12日
    浏览(37)
  • JavaScript语句和声明

    2024年02月07日
    浏览(35)
  • JavaScript条件判断if 语句

    一、if语句的分支 分类:单分支,双分支,多分支,分支嵌套 ()中可以是一个值,也可以是一个表达式 案例: 二、switch ()只能是变量或值,不能是表达式 案例: break必须添加,否则会继续往下执行 问题: 什么时候用if,什么时候用switch if:条件是一个范围 或者 是具体的

    2024年02月06日
    浏览(64)
  • JavaScript for循环控制语句

    1、什么是for循环 在JavaScript中, for 循环是一种常用的控制流语句,用于重复执行一段代码指定的次数。 for (循环变量初始化表达式; 循环条件表达式; 更新循环变量表达式) {     循环体 } 初始化表达式:只在循环开始时执行一次,通常用于初始化循环控制变量。 条件表达式

    2024年02月06日
    浏览(43)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包