JS学习Day2——循环

目录

内容概述：

1.输出n行相同代码

2.输出n行类似代码

3.求数字1-100的和

4.求班级的平均分

5.双重循环——打印n行n列图形

6.双重循环——打印倒三角图形

7.双重循环——打印九九乘法表

8.实现简单的密码验证（while循环）

9.continue和break的区别

10.案例检验：简易ATM

---

1.输出n行相同代码

2.输出n行类似代码

3.求数字1-100的和

for循环：

while循环：

4.求班级的平均分

为方便操作，输入的人数较少，分数分别为80、75、65。

注意：求和时一定要将score转换为浮点型，否则得到的结果如下图所示，而得到以下结果的原因是通过prompt获取到的score是string类型。

5.双重循环——打印n行n列图形

注意：一定要用str定义，而不能直接在for循环中输出爱心，否则得不到上图结果。

6.双重循环——打印倒三角图形

输入的行列数均为3.

7.双重循环——打印九九乘法表

注意在第一层循环中换行！！！

8.实现简单的密码验证（while循环）

由上述实例可以看出相较于for循环，while循环的条件语句更加灵活，在对数字进行计算时，二者可以通用（常用for），而在需要描述性的条件时，使用while循环。

9.continue和break的区别

注意看上述两组代码输出内容的区别，使用continue时，正常输出2、4、6、8、10，但使用break时，只输出了2。这是为什么呢？

因为continue指停止本次循环，进入下一次循环，而break指停止所有循环，所以执行到该语句时，所有循环结束。

上述案例所有源码：请去掉注释后一一运行更便于学习。

 // 1.输出n行相同代码
    /* var num = prompt('请输入你想输出的语句次数');
    for (var i = 1; i <= num; i++) {
      console.log('今天终于学完了！');
    } */

    // 2.输出n行类似代码
    /*  var num = prompt('请输入你想输出的语句次数');
     for (var i = 1; i <= num; i++) {
       console.log('今天是学习的第' + i + '天！');
     } */

    // 3.求数字1-100的和
    /*  var sum = 0;
     for (var i = 1; i <= 100; i++) {
       sum = sum + i;
     }
     console.log('数字1-100的和是' + sum); */

    /*  var sum = 0;
     var i = 1;
     while (i <= 100) {
       sum = sum + i;
       i++;
     }
     console.log('数字1-100的和是' + sum); */

    // 4.求班级的平均分
    /* var num = prompt('请输入班级的人数');
    var sum = 0;
    for (var i = 1; i <= num; i++) {
      var score = prompt('请输入学生的分数');
      sum = sum + parseFloat(score);
    }
    console.log('班级的总分是' + sum);
    console.log('班级的平均分是' + sum / num); */

    // 5.双重循环——打印n行n列图形
    /*  var rows = prompt('请输入你想打印的字符的行数');
     var cols = prompt('请输入你想打印的字符的列数');
     var str = '';
     for (var i = 1; i <= rows; i++) {
       for (var j = 1; j <= cols; j++) {
         str = str + '❤';
       }
       str += '\n';
     }
     console.log(str) */

    // 6.双重循环——打印倒三角图形
    /*  var rows = prompt('请输入你想打印的字符的行数');
     var cols = prompt('请输入你想打印的字符的列数');
     var str = '';
     for (var i = 1; i <= rows; i++) {
       for (var j = 1; j <= cols; j++) {
         str = str + '❤';
       }
       str += '\n';1
     }
     console.log(str); */

    // 7.双重循环——打印九九乘法表
    /* 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); */

    // 8.实现简单的密码验证（while循环）
    /* var message = prompt('请输入你的密码');
    var password = 123456;
    while (message != password) {
      alert('你输入的密码不正确，请重新输入');
      message = prompt('请重新输入你的密码');//注意：更改message的值，防止死循环
    }
    alert('密码输入成功'); */

    //9.continue和break的区别
    // 实例：找到2-10中为偶数的数
    /* for (var i = 2; i <= 10; i++) {
      if (i % 2 == 0) {
        console.log(i);
      }
      continue;
    }

    for (var i = 2; i <= 10; i++) {
      if (i % 2 == 0) {
        console.log(i);
      }
      break;
    } */

10.案例检验：简易ATM

案例要求：实现下图中的功能。

案例参考代码可转至ATM案例答案文章：

JS基础学习Day2——ATM案例答案（仅供参考）_L..P的博客-CSDN博客

本文所有知识点参考自B站黑马程序员视频：

17-九九乘法表_哔哩哔哩_bilibili