0
点赞
收藏
分享

微信扫一扫

JavaScript流程控制-分支

Mhhao 2022-05-05 阅读 126

目录

if分支语句

if else双分支语句

判断闰年案例

if else if 多分支语句

三元表达式

数字补0案例

switch多分支语句

判断星期案例

★★显示时间案例★★


流程控制主要有三种结构,分别是顺序结构、分支结构和循环结构。

顺序结构:程序按照代码的先后顺序依次执行。

分支结构

if分支语句

语法结构:

if (条件表达式) {

    语句;

}

执行思路:如果条件表达式为真,则执行大括号里面的语句;如果条件表达式为假,则不执行大括号里面的语句,执行大括号后面的语句。

if else双分支语句

语法结构:

if (条件表达式) {

    语句1;

} else {

    语句2;

}

执行思路:如果条件表达式为真,则执行语句1,否则执行语句2。

判断闰年案例

<script>
// 算法:能被 4 整除且不能整除 100 的为闰年或者能够被 400 整除的就是闰年(四年一闰,百年不闰,四百年再闰)
// 弹出 prompt 输入框,让用户输入年份,把这个值取过来保存到变量中
// 使用 if else 语句来判断是否是闰年,如果是闰年,就执行 if 大括号里面的输出语句,否则就执行 else里面的输出语句
// 注意里面的且 &&  还有或者 || 的写法,同时注意判断整除的方法是取余为 0

        var year = prompt('请输入一个年份:')
        if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) {
            alert('您输入的是闰年')
        } else {
            alert('您输入的是平年')
        }
</script>

if else if 多分支语句

语法结构:

if (条件表达式1) {
    语句1;
} else if (条件表达式2) {
    语句2;
} else if (条件表达式3) {
    语句3;
} else {
    最后的语句;
}
注意:最后一个没有if

执行思路:

如果条件表达式1满足就执行语句1,执行完毕后,退出整个if分支语句;

如果条件表达式1不满足,则判断条件表达式2,满足的话,执行语句2,以此类推;

如果上面的所有条件表达式都不成立,则执行else里面的语句。

三元表达式

语法结构:

条件表达式 ? 表达式1 : 表达式2

执行思路:如果条件表达式的值为真,返回表达式1的值,如果为假,则返回表达式2的值。

数字补0案例

<script>
    // 用户输入0~59之间的一个数字
    // 如果数字小于10,则在这个数字前面补0,(加0拼接)否则不做操作
    // 用一个变量接受这个返回值,输出
    var time = prompt('请您输入一个 0 ~ 59 之间的一个数字');
    // 三元表达式   表达式 ? 表达式1 :表达式2 
    var result = time < 10 ? '0' + time : time;   //把返回值赋值给一个变量
    alert(result);
</script>

switch多分支语句

语法结构:

switch (表达式) {
    case value1:
        执行语句1;
        break;
    case value2:
        执行语句2;
        break;
    ...
    default:
        执行最后的语句;
}

执行思路:利用表达式的值和 case 后面的选项值相匹配,如果匹配上,就执行该 case 里面的语句,如果都没有匹配上,那么执行 default 里面的语句。

注意事项:

  1. 开发里面表达式经常写成变量
  2. 表达式的值和case里面的值相匹配的时候是  全等
  3. 如果当前的case里面没有break则不会退出switch,会继续执行下一个case

判断星期案例

假设这个月1号是星期三。让用户输入本月的日期(即1日-31日),如果输入的不是1-31日则提示重新输入。如果输入正确则返回这一天是星期几。

    <script>
        var date = prompt('请输入1-31的任意一个日期:')
        if (date < 1 || date > 31) {
            alert('请重新输入')
        } else {
            var day = date % 7
            switch (day) {
                case 1:
                    alert('这一天是星期三')
                    break
                case 2:
                    alert('这一天是星期四')
                    break
                case 3:
                    alert('这一天是星期五')
                    break
                case 4:
                    alert('这一天是星期六')
                    break
                case 5:
                    alert('这一天是星期日')
                    break
                case 6:
                    alert('这一天是星期一')
                    break
                case 0:
                    alert('这一天是星期二')
                    break
            }
        }
    </script>

★★显示时间案例★★

工作中常用情景:秒杀倒计时

需求:用户输入一个秒数,返回xx天xx时xx分xx秒。而且如果转换完的数字小于10时前面补0

举例:用户输入10000,我们输出:00天02时46分40秒

    <script>
        // 用户输入10000,我们输出:00天02时46分40秒
        // var num = Number(prompt('请输入秒数:'));
        var num = 10000;
        // 秒
        var s = num % 60;
        s = s < 10 ? '0' + s : s;

        // 分钟
        var m = parseInt(num / 60) % 60;  
        // xxx.xxx分钟,转为数字型,取前面的整数即为分钟,这个分钟又存在满60分钟进到小时里的关系,所有%60,得到剩下来的分钟数
        m = m < 10 ? '0' + m : m;

        // 时
        var h = parseInt(num / 3600) % 24;
        // xxx.xxx小时,转为数字型,取前面的整数即为时,这个时又存在满24小时进到一天里的关系,所有%24,得到剩下来的小时数
        h = h < 10 ? '0' + h : h;

        // 天
        var d = parseInt(num / (3600 * 24));
        // 一天 = 3600秒 * 24小时    (一小时 = 3600秒)
        d = d < 10 ? '0' + d : d;

        alert(d + '天' + h + '时' + m + '分' + s + '秒')
    </script>
举报

相关推荐

0 条评论