JS-part1.2-流控制语句

相关课程来自于这里!
Js中语句结构、思想和java语句结构一模一样,重点掌握!

一、流控制语句

1.1 条件判断语句

1 if条件判断语句

格式一:只关注条件成立后的操作

if(判断条件){
语句块;
}

注:不像shell里还有then……blablabla

格式二:不管条件成立或者不成立,都有对应的内容

if(判断条件){
	语句块1;//条件成立
}else{
	语句块2;//条件不成立
}

格式三:根据多个判断条件,来决定执行的结果

If(判断条件1){
	语句块1;
}else if(判断条件2){
	语句块2;
}else if(判断条件3){
	语句块3;
}else{
	语句块n;
}
<!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>if01</title>
    <script>
        var x=10;
        var y=20;

        //格式一
        // if(x>y){
        //     alert("我是成立的");
        // }
        //格式二
        // if(x==y){
        //     x++;
        //     y++;
        //     alert(x+","+y);
        // }else{
        //     --x;
        //     --y;
        //     alert(x+","+y);  //9,19
        // }
        //格式三
        if(x>y){    //10>20 false
            x*=y;
            alert(x+","+y);
        }else if(x<y){   //10<20  true
            alert(x>30?x++:y++);     //y=20
        }else if(x==y){
            x%=y;
            alert(x+","+y);
        }else{
            alert(x+","+y); 
        }
    </script>
</head>
<body>
    
</body>
</html>

练习:
在这里插入图片描述

总结: 闰年:能整除400或(整除4却不能整除100)

2 switch语句

格式:

switch(变量名){
	case 值1:语句块1;break;
	case 值2:语句块2;break;
	case 值3:语句块3;break;
	default:语句块n;
}

:加入一个case语句后面没有break关键词,那么程序匹配成功(===)后不管下一个case是否满足都会继续往下执行;当所有条件都不满足的时候,执行default.
switch(常量值) case 常量值 ,这俩都得是具体的值!不能写判断什么的。

<!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>switch语句</title>
    <script>
        //var str="tiger";

        // switch(str){
        //     case "cat":alert("猫咪");break;
        //     case "tom":alert("汤姆");break;
        //     case "tiger":alert("老虎");break;    //老虎
        //     default:alert("没匹配到值");
        // }

        var str="tom";
        switch(str){
            case "cat":alert("猫咪");break;
            case "tom":alert("汤姆");    //输出:汤姆 老虎 没匹配到值
            case "tiger":alert("老虎");   
            default:alert("没匹配到值");
        }
    </script>
</head>
<body>
    
</body>
</html>

练习:根据月份在控制台输出相应的天数(利用break穿透)

<script>
    var month = 2;
	//利用switch的穿透
    switch(month){
        case 1:
        case 3:
        case 5:
        case 7:
        case 8:
        case 10:
        case 12:
            console.log('31天');
            break;
        case 4:
        case 6:
        case 9:
        case 11:
            console.log('30天');
            break;
        case 2:
            console.log('28天');
    }
</script>

1.2 循环语句

在这里插入图片描述

while语句能做的事for语句都可以做,优先用for循环语句。
但在不确定循环次数时,用while

1 for循环语句

格式:

for(循环变量的初始化1;判断条件2;循环变量的运算4){
	循环体3;
}

条件成立的情况下执行流程:1–>2–>3–>4–>2–>3–>4…

<!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>for语句</title>
    <script>
        //弹出1-5之间的数字
        for(var i=1;i<=5;i++){
            alert(i);
        }
        //求1-100之间的和
        var res=0;
        for(var j=1;j<=100;j++){
            res+=j;
        }
        alert("1-100之间的数字和:"+res);
    </script>
</head>
<body>
    
</body>
</html>

2 while循环语句

格式:

while(判断条件){
	循环体;
}
<!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>while语句</title>
    <script>
        //求1-100之间的和
        //定义一个循环变量
        var i=1;
        var s=0;
        while(i<=100){
            s+=i;
            i++;
        }
        alert("1-100之间的数字和:"+s);

    //     var i=1;
    //     while(i<=5){

    //         switch(i){
    //             case 2:++i;
    //             case 3:++i;
    //             case 4:++i;break;
    //             case 5:++i;
    //             default:--i; //i=0 继续循环  //死循环!!
    //         }
    //     }
    //     alert(i);
    // </script>
</head>
<body>
    
</body>
</html>

3 do while循环语句

do while循环的循环体能保证至少执行一次

格式:

do{
	循环体;
}while(判断条件)
<!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>dowhile语句</title>
    <script>
        //1-100之间的偶数和
        //定义一个循环变量
        var i=1;
        var s=0;

        do{
            //每找到一个数字先判定奇偶性
            if(i%2==0){
                //如果判断出是偶数,就要进行相加
                s+=i;
            }
            i++;
        }while(i<=100)
        alert("1-100之间的偶数和:"+s);
        
    </script>
</head>
<body>
    
</body>
</html>

以上7个语句:写法 思想
if语句的三种写法
switch语句
for语句
while语句
do while语句

练习:
拆一个四位数
<script>
    // 拆一个四位数
    var num = 1234;

    //1.千位,除以1000取整
    var a = parseInt(num / 1000);

    //2.百位,
    //方案1:num- a * 1000, 用剩下的数字 / 100取整
    var b = parseInt((num - a * 1000) / 100);
    //方案2:num 和 1000取余,剩下的就是不能整除1000的
    var b = num % 1000 /100;

    //3.十位
    //方案1: num - a * 1000 - b * 100,剩下的 /10取整

    //方案2:num和100取余,剩下的就是不能被100整除的
    var c = parseInt(num % 100 /10);

    //4.个位
    var d = parseInt(num % 10);
</script>
时间换算
<script>
		//换算 秒
        var time = 1214675;

        //1.换算天
        //time / 一天的秒数,然后取整
        var day = parseInt(time / (60 * 60 * 24));
        console.log(day);

        //2.换算小时
        //去掉整天的秒数,再计算
        var hours = parseInt(time % (60 * 60 * 24) /(60 * 60));
        console.log(hours);

        //3.换算分钟
        //去掉整天和整小时的秒数,再计算
        //按照整小时取余,得到的就是不够一个小时的秒数
        var min = parseInt(time % (60 * 60) / 60);

        console.log(min);
</script>
水仙花数:三次自幂数
<script>
    // 三次自幂数
    // 三位数,一个数字的每一位的三次方之和,和这个数字一样
    // 取值范围:100~999

    // 思路:
    // 1.循环得到100~999的数字
    // 2.把每一个数字拆开
    // 3.做判断

    //1.循环
    for(var i=100;i<=999;i++){
        
        //2.拆数字
        var a = parseInt(i / 100);
        var b = parseInt(i % 100 / 10);
        var c = i % 10;

        //3.判断是不是三次自幂数
        if(a ** 3 + b ** 3 + c ** 3 === i){
            console.log(i + '是水仙花数');
        }
    }
</script>

在这里插入图片描述

打印三角形
<script>
    // 页面上打印一个三角形
    // *
    // * *
    // * * *
    // * * * *

    // 分析:
    // 第 1 行 1 个
    // 第 2 行 3 个
    // 第 3 行 3 个
    // 第 n 行 n 个

    // 循环出现多少行
    for(var i = 1; i <= 9; i++){

        //列
        for(var j = 1; j <= i; j++){
            document.write('* ');
        }
        document.write('<br>');
    }

    // 第二个三角形
    // * * * *
    // * * *
    // * *
    // *

    //行
    for(var i = 1; i <= 9; i++){

        //列
        for(var j = i; j <= 9; j++){
            document.write('* ');
        }
        document.write('<br>');
    }


    // 第三个三角形
    // * * * *
    //   * * *
    //     * *
    //       *
    
    for(var i = 1; i <= 9; i++){

        //要出对应的空格
        //当i===1时,执行0次
        //当i===2时,执行1次
        for(var k = 1; k < i; k++){
            document.write('&nbsp;');
        }
        //要出对应的星号
        for(var j = i; j <= 9; j++){
            document.write('* ');
        }
        //要出换行
        document.write('<br>');
    }

</script>
<script>
/*
    等腰三角形

        *
       * *
      * * *
     * * * *
一个右下的直角三角形,每一个星号带一个空格
*/
//打印行
//    for(var i = 1; i <= 9; i++){
//        //打印列
//        //第1行,打印8个空格
//        //第2行,打印7个空格
//         for(j = i; j <= 9; j++){
//             document.write('&nbsp;');
//         }
//         for(j = 1; j <= i; j++){
//             document.write('* ');
//         }
//         document.write('<br>');
//    }

    /*
            *
           ***
          *****
    */
    for(var i = 1; i <= 9; i++){
        
        if(i % 2 === 1){
        //空格
            for(j = i; j <= 9; j++){
                document.write('&nbsp;');
            }
            for(j = 1; j <= i; j++){
                document.write('* ');
            }
            document.write('<br>');
        }
    }
</script>  

1.3 循环控制语句

1. break

当你在一个循环里面执行到break关键字的时候,会直接结束整个(当前)循环.

练习:
最大公约数
<script>
    /* 
    最大公约数
    两个数字都能整除,无限接近小的那个数字

    方法一:

    从大的数字开始,向1走,找到大的数值就打断循环不再继续
    */
//    var n = 125;
//    var m =8;

//    //提前准备一个变量当作最大公约数
//    var gys = 1;

//    for(var i = m; i > 1; i--){

//     //    判断是不是最大公约数
//         if(n % i ===0 && m % i ===0){
//             //因为是倒着循环,所以找到的即是最大的,结束循环
//             gys = i;
//             break;
//         };
//    };
//    console.log(gys);

   /*
   方法二:

   辗转相除法求最大公约数
   a = 8;
   b = 5;

   a / b如果可以整除,那么最大公约数就是b
   如果不可以整除,继续计算 a / (a % b),如果整除,那么最大公约数就是a % b
   */
  var a = 8;
  var b = 4;

//   判断两个数字的大小
  if(a < b){
    var tmp = a;
    a = b;
    b = tmp;
  }
  
  while(a % b !== 0){
    //不能整除,辗转相除
    //把原先的b赋值给a
    //让b得到原先的a % b的值
    var tmp = a % b;
    a = b;
    b = tmp;
  }
  
  var zdgys = b;
  console.log(a + '和' + b + '的最大公约数:' + zdgys);

</script>
最小公倍数
<script>
var n = 5;
var m = 6;

if(n > m){
    var tmp = n;
    n = m;
    m = tmp;
}

var gbs = m;
 while(gbs % m !== 0 || gbs % n !== 0){
    //gbs放大一点再来一遍
    gbs += m;
 }

 console.log(n + '和' + m + '的最小公倍数:' + gbs);
</script>

2. continue

结束本次循环,开始下一次(continue后面的代码不再执行)

<script>
    for(i = 1; i <= 5; i++){
		//第三个包子掉地上了
        if(i === 3){
            console.log('第' + i + '个包子掉地下了');
            //本次循环,continue后面的代码就全都不执行了
            //直接跳转到i++位置
            continue;
        }
        console.log('我吃了' + i + '个包子');
    }
</script>

在这里插入图片描述

3. JS标记语句

自己做一个标记,想跳到哪里跳哪里

写法: 标记名:

在要跳转到的位置写: 
				标记名:
在要跳出的位置写: 
				break 标记名;
<script>
here:
    for(i = 1; i <= 5; i++){
        for( j = 1; j <= 3; j++){

            if(i === 3 && j ===2){
                console.log('看到半条虫子');
                break here;
            }

            console.log('这是我吃的第' + i + '个包子的第' + j + '口');
        }
    }
</script>

在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值