JS if else语句(条件判断语句)的详细使用

 更新时间:2022年09月15日 10:24:29   作者:恁..  
条件语句用于基于不同的条件来执行不同的动作,下面这篇文章主要给大家介绍了关于JS if else语句(条件判断语句)的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下

前言

条件判断语句是程序开发过程中一种经常使用的语句形式,和大部分编程语言相同,JavaScript 中也有条件判断语句。所谓条件判断,指的是程序根据不同的条件来执行不同的操作,例如根据年龄来显示不同的内容,根据布尔值 true 或 false 来判断操作是成功还是失败等。

JavaScript 中支持以下几种不同形式的条件判断语句:

  • if 语句;
  • if else 语句;
  • if else if else 语句;
  • switc case 语句。

下面为大家介绍if、if else、if else if else 语句的使用

if语句

if 语句是 JavaScript 中最简单的条件判断语句,语法格式如下:

if(条件表达式){
    // 要执行的代码;
}

示例代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JavaScript</title>
</head>
<body>
    <script type="text/javascript">
        var age = 20;
        if(age >= 18){      // 如果 age >= 18 的结果为 true,则执行下面 { } 中的代码
            alert("adult");
        }
    </script>
</body>
</html>

运行效果图如下:

if else 语句

if else 语句是 if 语句的升级版,它不仅可以指定当表达式成立时要执行的代码,还可以指定当表达式不成立时要执行的代码,语法格式如下:

if(条件表达式){
    // 当表达式成立时要执行的代码
}else{
    // 当表达式不成立时要执行的代码
}

示例代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JavaScript</title>
</head>
<body>
    <script>
       var age =prompt("请输入你的年龄:");
       if(age >=18){
        alert('你可以进入该网吧!');
       }
       else{ 
        alert('你还是未成年哦!');
       }
    </script>
</body>
</html>

运行效果图:

if else if else 语句

if 和 if else 语句都只有一个条件表达式,而 if else if else 语句是它们更高级的形式,在 if else if else 语句中允许您定义多个条件表达式,并根据表达式的结果执行相应的代码,语法格式如下:

 if (条件表达式 1) {
    // 条件表达式 1 为真时执行的代码
} else if (条件表达式 2) {
    // 条件表达式 2 为真时执行的代码
}
...
  else if (条件表达式N) {
    // 条件表达式 N 为真时执行的代码
} else {
    // 所有条件表达式都为假时要执行的代码
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var score=prompt('请输入你的成绩:');
        if(score>=90){     
            alert('A');    //成绩90分以上输出A
        }else if(score>=80){
            alert('B');    //成绩在80-90之间输出B
        }else if(score>=70){
            alert('C');    //成绩在70-80之间输出C
        }else if(score>=60){
            alert('D');    //成绩在60-70之间输出D
        }else{
            alert('E');    //60分以下输出E
        }
    </script>
</head>
<body>
    
</body>
</html>

运行效果图如下:

注意事项

使用嵌套 if else 时,如果只有一行语句,也应该使用大括号包裹起来,避免条件歧义。

总结

到此这篇关于JS if else语句(条件判断语句)的文章就介绍到这了,更多相关JS if else 条件判断语句内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 解决webpack dev-server不能匹配post请求的问题

    解决webpack dev-server不能匹配post请求的问题

    这篇文章主要介绍了解决webpack不能匹配post请求的问题,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-08-08
  • 微信小程序实现环形进度条

    微信小程序实现环形进度条

    这篇文章主要为大家详细介绍了微信小程序实现环形进度条,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-06-06
  • TypeScript工具类 Partial 和 Required 的场景分析

    TypeScript工具类 Partial 和 Required 的场景分析

    这篇文章主要介绍了TypeScript工具类 Partial 和 Required 的详细讲解,本文通过场景描述给大家详细讲解工具类的使用,结合实例代码给大家介绍的非常详细,需要的朋友可以参考下
    2022-09-09
  • javascript设计模式 – 解释器模式原理与用法实例分析

    javascript设计模式 – 解释器模式原理与用法实例分析

    这篇文章主要介绍了javascript设计模式 – 解释器模式,结合实例形式分析了javascript解释器模式相关概念、原理、用法及操作注意事项,需要的朋友可以参考下
    2020-04-04
  • js+html+css实现鼠标移动div实例

    js+html+css实现鼠标移动div实例

    移动div对于很多的网有们来说是一件很熟悉的事了,本文老生长谈,用js实现鼠标移动div,希望大伙们可以举一反三,感兴趣的朋友可以参考下,或许本文对你有所帮助
    2013-01-01
  • 原生JS实现不断变化的标签

    原生JS实现不断变化的标签

    这篇文章主要介绍了原生JS实现不断变化的标签,可以上下浮动,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-05-05
  • JS作为值的函数用法示例

    JS作为值的函数用法示例

    这篇文章主要介绍了JS作为值的函数用法,结合实例形式分析了javascript处理函数作为参数的使用技巧,非常具有实用价值,需要的朋友可以参考下
    2016-06-06
  • 微信小程序导航栏跟随滑动效果的实现代码

    微信小程序导航栏跟随滑动效果的实现代码

    这篇文章主要介绍了小程序导航栏跟随滑动效果,本文通过实例代码给大家介绍的非常详细,具有一定的参考借鉴价值 ,需要的朋友可以参考下
    2019-05-05
  • 在TypeScript项目中进行BDD测试

    在TypeScript项目中进行BDD测试

    这篇文章主要介绍了在TypeScript项目中进行BDD测试,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步早日升职加薪
    2022-04-04
  • js实现快速分享功能(你的文章分享工具)

    js实现快速分享功能(你的文章分享工具)

    这是一款简单易用的文章分享工具,您只需将下面的html代码拷贝到模板中就可以实现文章快速分享功能,具体的实现如下,感兴趣的朋友可以参考下哈,希望对大家有所帮助
    2013-06-06

最新评论