2021-5-25重拾JS-07-流程控制-循环

目标：解决以下问题

• for循环的执行过程

           //for循环语法结构
            // for(初始化变量;条件表达式;操作表达式){
            //     循环体
            // }
            for(var i=0;i<100;i++){
                console.log('你好哇，JS');
            }
            //输出100次'你好哇，JS'

             //循环重复相同代码：控制输出次数
            var times=prompt('你想输出几次：');
            for(var i=1;i<=times;i++){
                console.log('爱你就像爱生命');
            }

             //循环重复不同代码：输出一个人1岁到100岁
            for(var i=1;i<=100;i++){
                if(i==1){
                    console.log('他出生了！');
                }else if(i==100){
                    console.log('他凉了，村里人都来吃席了');
                }else{
                    console.log('他今年岁'+i+'了');
                }
            }
  

 

• 使用断点来调试观察代码的执行过程

浏览器中按F12-->sources-->找到需要调试的文件-->在程序的某一行设置断点

Watch：通过Watch可以见识变量的值的变化，非常的常用

F11：程序单步执行，让程序一行一行地执行，观察变量的值的变化

• 使用for循环完成累加求和等案例

累加案例：

   //1~100累加求和案例
            var sum=0;
            for(var i=1;i<=100;i++){
                sum+=i;
            }
            console.log(sum);//输出位5050

   //求1~100所有数的平均数
            var sum=0;
            for(var i=1;i<=100;i++){
                sum+=i;
            }
            console.log(sum/100);

            //求1~100所有的奇数和偶数的和
            var even=0,odd=0;
            for(var i=1;i<=100;i++){
               if(i%2==0){
                even+=i;
               }else{
                   odd+=i;
               }
            }
            console.log('偶数的和为'+even);
            console.log('奇数的和为'+odd);

            //1~100之间能被3整除的数的和
            var sum3=0;
            for(var i=1;i<=100;i++){
                if(i%3==0){
                    sum3+=i;
                }
            }
            console.log(sum3);

案例二：学生成绩案例

      //学生成绩案例：输入班级人数和分数求总分以及平均分
            var result=0,grade=0;
            var num=prompt('输入学生人数：');
            for(var i=1;i<=num;i++){
                var grade=prompt('输入学生分数');
              result+=parseFloat(grade);
            }
            console.log('总分为'+result);
            console.log('平均分为'+result/num);

 

• 能够使用双重for循环完成乘法表案例

案例1：打印n行n列星星

   //案例1：打印n行n列星星
            var row=prompt('请输入打印几行');
            var col=prompt('请输入打印几列');
            var str='';
            for(var i=1;i<=row;i++){
                for(var j=1;j<=col;j++){
                    str+='☆'
                }
                str=str+'\n';
            }
            console.log(str);

案例2：打印n行n列倒三角

   //案例2:打印倒三角
            var row=prompt('请输入打印几行');
            var col=prompt('请输入打印几列');
            var str='';
            for(var i=1;i<=row;i++){
                for(var j=0;j<=col-i;j++){
                    str+='☆'
                }
                str=str+'\n';
            }
            console.log(str);

案例3：打印九九乘法表

     //九九乘法表案例
            var str='';
            for(var i=1;i<=9;i++){
                for(var j=1;j<=i;j++){
                    str+=j+'*'+i+'='+i*j+'\t';
                }
                str+='\n';
            }
            console.log(str);

 

• 说出while循环和do while 循环的区别

while循环：

            // while的语法结构
            // while(条件表达式){
            //     循环体
            // }

                //案例1:打印人的一生，从1岁到100岁
            var i=1;
            while (i <= 100) {
                console.log('你今年'+i+'岁了');
                i++;
            }
            //计算1~100之间所有整数的和
            var i=1,sum=0;
            while (i <= 100) {
                sum+=i;
                i++;
            }
            console.log('1~100之间的整数的和为'+sum);
            //案例3：弹出一个提示框进项操作
            var love=prompt('你爱不爱我？');
            while(love!=='我爱你'){ 
                alert('你爱我吗')
            }
            alert('我也是')

do while循环：

  
             //案例1:打印人的一生，从1岁到100岁
             var i=1;
            do{
                console.log('你今年'+i+'岁了');
                i++;
            }while(i<=100)
            //计算1~100之间所有整数的和
            var sum=0,j=1;
            do{
                sum+=j;
                j++;
            }while(j<=100)
            console.log(sum);

 

• 能够说出break和continue的区别

continue关键字：continue关键字用于立即要出本次循环，继续下一次循环

  //continue案例
           for(var i=1;i<=5;i++){
            if(i==3){
                continue;
            }
            console.log('今天吃了'+i+'个包子');
           }
           console.log('今天吃了'+i+'个包子');
            
            //输出结果为：
              今天吃了1个包子
              今天吃了2个包子
              今天吃了4个包子
              今天吃了5个包子
              今天吃了6个包子

break关键字：退出整个循环

 //break案例
        for(var i=1;i<=5;i++){
            if(i==3){
                break;
            }
            console.log('今天吃的第'+i+'个包子');
        }