【Javascript】三种分支结构语法的总结

最新推荐文章于 2024-01-04 20:27:41 发布

101茂茂

最新推荐文章于 2024-01-04 20:27:41 发布

阅读量406

点赞数

文章标签：前端 javascript

本文链接：https://blog.csdn.net/weixin_64691270/article/details/124002589

版权

switch-case分支结构

1.语法

switch(表达式){	// 不是布尔类型：是一个确定的变量
    case 值1:	 // 值1,值2...都是字面量
        表达式的结果 === 值1，需要执行的代码
        break;
    case 值2:
        表达式的结果 === 值2，需要执行的代码
        break;
    case 值3：
        表达式的结果 === 值3，需要执行的代码
        break;
    .......
    default:
        表达式的结果和上面所有的case后面的值都不全等，则会执行这里的代码
        break;
}

2.注意事项
- 1.表达式的结果要和值一定是全等的关系===
- 2.break作用：结束该switch语句，所以一般情况下要加上，如果不加上则会发生穿透
  - 穿透：从上一个case代码快执行到下一个case代码快
  - break关键字的作用就是防止穿透
- 3.default语句可以写在任何地方，也可以省略，但是一般写在最后，这是一种代码规范

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<script>
    /**
     switch-case分支结构：常用于值匹配
        * 匹配：全等的关系

     * switch(条件值){
            case 值1:
                条件值 === 值1，需要执行的代码
                break;
           case 值2:
                条件值 === 值2，需要执行的代码
                break;
           case 值3：
                条件值 === 值3，需要执行的代码
                break;
            .......
           default:
                条件值和上面所有的case后面的值都不全等，则会执行这里的代码
                break;
        }

    /**switch语句注意事项
     * 1.表达式的结果要和值一定是全等的关系===
     * 2.break作用：结束该switch语句，所以一般情况下要加上，如果不加上则会发生穿透
     *      * 穿透：从上一个case代码快执行到下一个case代码快
     *      * break关键字的作用就是防止穿透
     *  3.default语句可以写在任何地方，也可以省略，但是一般写在最后，这是一种代码规范
     */

    //示例：用户输入黑马学科编号，告诉用户学习什么学科  1-前端  2-PHP  3-java  4-UI
    let subject= +prompt("请输入您要报名的学科编号，1-前端  2-PHP  3-java  4-UI");

    switch (subject){
        case  1:
            alert("恭喜你选择了2020年最有钱途的学科！");
            break;
        case  2:
            alert("选择了PHP，臭流氓!");
            break;
        case  3:
            alert("选择了Java，请问植发多少钱一根？");
            break;
        case  4:
            alert("未来的UI视觉交互设计师");
            break;
        default :
            alert("脑子有包");
            break;
    }
</script>
</body>
</html>

switch-case穿透用法

合理穿透：多种值需要执行相同代码

<script>
    /**合理穿透：当存在多种值需要执行相同代码时使用穿透可以节省代码
     * 用户输入某一个月份，告诉用户这个月份属于什么季节
     * 12，1，2 冬季
     * 3，4，5 春季
     * 6，7，8 夏季
     * 9，10，11 秋季
     */
    let month = +prompt("请输入月份");
    switch (month){
        case 12:
        case 1:
        case 2:
            alert("冬季");
            break;
        case 3:
        case 4:
        case 5:
            alert("春季");
            break;
        case 6:
        case 7:
        case 8:
            alert("夏季");
            break;
        case 9:
        case 10:
        case 11:
            alert("秋季");
            break;
        default:
            alert("你来自火星吧？");
            break;
    }

</script>

三元表达式

1.运算符根据参与运算的值数量分为一元、二元、三元运算符
- 一元运算符：只能操作一个值 ++ – ！
- 二元运算符：操作两个值 1 + 1 1 > 0
- 三元运算符：操作三个值
2.三元运算符语法
- 三元运算符： ?:
- 三元表达式：
```
bool表达式?代码1：代码2
```
  - 1.如果表达式成立则执行代码1，否则执行代码2
2.如果代码1或者代码2有运算结果则三元运算式的结果就是他们其中的一个
- 三元运算符做的事和if-else类似，只是代码更简洁
- 三元表达式中：表达式部分永远是条件，最终代表整个结果的不是代码1 就是代码2

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

</body>

<script>
    /*
    一元运算符：由一个值参与的运算符  ：  a++    a--  !a
     二元运算符：  由两个值参与的运算符 ：  a + b   a > b
     三元（三目）运算符：由三个值参与的运算符
    */

    /*
     * 三元运算符：  ?:
     * 三元表达式：   表达式?代码1：代码2
     *      * 1.如果表达式成立则执行代码1，否则执行代码2
     *      * 2.如果代码1或者代码2有运算结果则三元运算式的结果就是他们其中的一个
     *
     * 三元运算符做的事和if-else类似，只是代码更简洁
     */

    //案例1:
    let num1 = 10;
    num1 > 0 ? console.log('哈哈') : console.log('呵呵');

    //上面这个三元表达式等价于下面的if - else语句
    // if(num1 > 0){
    //     console.log ( "哈哈" );
    // }else{
    //     console.log ( "呵呵" );
    // }

    //案例2：三元表达式一般应用是用来赋值
    let num2 = 20;
    let res2 = num2 > 0 ? num2 + 1 : num2 - 1;
    console.log ( res2 );//21

    //上面这个三元表达式等价于下面的if - else语句
    // if(num2 > 0){
    //     res2 = num2 + 1;
    // }else{
    //     res2 = num2 - 1;
    // }

    //练习：输出性别  （实际开发中，性别通常会使用一个布尔类型来存储，这样存储效率更高）
    let name = "马云";
    let age = 38;
    let gender = true;      //true男 1         false女 0
    console.log("我的名字是"+name+"，我的年龄是"+age+"，我是一个"+(gender == true ? "男":"女")+"生");


</script>
</html>

三种分支结构语法总结

1.原则上，三种分支结构语句之间可以互转，只不过每一种分支结构语句适用场景不一样
2.if分支结构：适合条件判断
- 最常用：if-else 两种互斥条件判断
3.switch-case 适合做固定值匹配
4.三元表达式：比if-else代码更简洁，但是代码量较多时易读性变差。以后它有一个最大的优点：可以在模板中添加
- 反引号
- 模板引擎
- 插值表达式

以上内容希望可以对你有所帮助！

101茂茂

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
【Javascript】三种分支结构语法的总结

switch-case分支结构1.语法switch(表达式){ // 不是布尔类型：是一个确定的变量 case 值1: // 值1,值2...都是字面量表达式的结果 === 值1，需要执行的代码 break; case 值2: 表达式的结果 === 值2，需要执行的代码 break; case 值3：表达式的结果 === 值3，需要执行的代码 break; .....
复制链接

扫一扫