JavaScript条件语句和循环语句

177 阅读2分钟

JavaScript语句

一、分支语句(条件语句)

要根据条件选择执行代码,这种就叫分支结构

1、单分支使用语法:

括号内的条件为true时,进入大括号里执行代码

小括号内的结果若不是布尔类型时,会发生隐式转换转为布尔类型

  <body>
    <script>
      // 请输入你的分数,如果大于等于 60,则提示你  及格了
      let num = +prompt('请输入分数')
      // 添加判断结构
      // 如果处理代码只有一句,那么也可以省略{},意味着如果没有添加{},那么if结构只会影响后面一句
      if (num >= 60) {
        alert('及格了')
        console.log(123)
      }
    </script>
  </body>
2、双分支语句

双分支if语法:

  <body>
    <script>
      // 工龄 > 1,有资金,否则没有
      // let year = +prompt('请输入工作年限')
      // if (year > 1) {
      //   alert('恭喜奖金10000块')
      // } else {
      //   alert('继续努力,明年会有')
      // }
      let year = +prompt('请输入年份')
      if ((year % 4 === 0 && year % 100 !== 0) || year % 400 === 0) {
        alert('闰年')
      } else {
        alert('平年')
      }
    </script>
  </body>
3、多分支语句

语法:

(1)先判断条件1,若满足条件1就执行代码1,其他不执行

(2)若不满足则向下判断条件2,满足条件2执行代码2,其他不执行

(3)若依然不满足继续往下判断,依次类推

(4)若以上条件都不满足,执行else里的代码n

注:可以写N个条件,但这里演示只写2个

<body>
    <script>
        let num = +prompt("今天星期几");
        if (num==1) {
            document.write("今天吃白饭");
        }else if (num == 2) {
            document.write('今天吃龙虾');
        }else if (num == 3) {
            document.write('今天吃鲍鱼');
        }else if (num == 4) {
            document.write('今天吃鸭脖');
        }else if (num == 5) {
            document.write('今天吃软饭');
        }else if (num == 6) {
            document.write('今天吃烧鸡');
        }else if (num == 7) {
            document.write('今天吃烤鸭');
        }else {
            document.write('没有星期' + num);
        }
    </script>
</body>
4、三元运算符

(1)其实是比 if 双分支 更简单的写法,有时候也叫做三元表达式

(2)符号:? 与 : 配合使用

(3)语法:条件?满足条件的代码 : 不满足条件的代码

(4)一般用来取值

<body>
    <script>
        let num1 = +prompt('请输入num1');
        let num2 = +prompt('请输入num2');
        let num3 = num1 > num2?num1:num2;
        document.write(num3);
    </script>
</body>
二、循环语句
1、while循环

(1)跟if语句很像,都要满足小括号里的条件为true才会进入执行代码

(2)while大括号里代码执行完毕后不会跳出,而是继续回到小括号里判断条件是否满足,若满足又执行大括号里的代码,然后再回到小括号判断条件,直到括号内条件不满足,即跳出

2、while 循环注意事项:

循环的本质就是以某个变量为起始值,然后不断产生变化量,慢慢靠近终止条件的过程。 所以,循环需要具备三要素:

(1)变量起始值

(2)终止条件(没有终止条件,循环会一直执行,造成死循环)

(3)变量变化量(用自增或者自减)

<body> 
    <script>
        // let num = +prompt('请输入打印的次数');
        // let i = 1;
        // while (i<=num) {
        //     document.write(`${i}月薪过万<br>`);
        //     i++;     
        // }
        let i = +prompt('次数');
        while (i>0){
            document.write(`${i}月薪过万<br>`);
            i--;
        }
    </script>
</body>
3、运用while实现简易取款机
<body>
    <script>
        let serve;//服务
        let balance=0;//余额
        while (serve !==4){
            serve = +prompt(`
            请输入你所需要的服务
            1.存钱
            2.取款
            3.查看余额
            4.退出`);
            if (serve === 1){
                let deposit = +prompt('请输入你要存的金额');
                if(deposit>=0){
                    balance +=deposit;
                }else{
                    alert('输入金额必须大于或等于0');
                }
            }else if (serve === 2){
                let withdrawal = +prompt('请输入您的取款金额');
                if (withdrawal<balance){
                    if(withdrawal>=0){
                        balance -=withdrawal;
                    }else{
                        alert('输入金额必须大于或者等于0');
                    }
                }else{
                    alert('您的余额不足');
                }               
            }else if (serve === 3){
                alert('您的余额为'+ balance)
            }
        }
​
    </script>
</body>
4、for循环

(1)for循环语法

也是重复执行代码

好处:把声明起始值、循环条件、变化值写到一起,让人一目了然

<body>
    <script>
        /*for(声明循环次数的变量;循环条件;变化值){
            被循环的代码;
        }*/
        for (let i = 0; i < 5; i++) {
            document.write(`第${i+1}次循环`);
            let j = i; 
            console.log(i);
            console.log(j);       
        }    
    </script>
</body>
5、循环退出

(1)continue

结束本次循环,继续下次循环

(2)break

跳出所在的循环

6、嵌套循环

(1)嵌套循环语法

<body>
    <script>
        /*for(声明循环次数的变量;循环条件;变化值){
            for(声明循环次数的变量;循环条件;变化值){
            被循环的代码;
            }
        }*/
</script>
</body>

(2)嵌套循环案例

九九乘法表

需求分析: ​ ①:只需要把刚才倒三角形星星做改动 ​ ②:换成 1 x 1 = 2 格式

<body>
    <script>
        for (let i = 1; i<10; i++) {
            for (let j = 1; j <=i; j++) {
                document.write(`${j}*${i}=${i*j}  &nbsp; `);       
            }
            document.write(`<br>`);
        }
    </script>
</body>
7、for循环和while循环的区别

(1)当如果明确了循环的次数的时候推荐使用for循环

(2)当不明确循环的次数的时候推荐使用while循环