一、while循坏

1、解释说明

    while (循环结束条件) {  循环体}

        // 1. 初始化var num = 1;    // 2. 循环结束条件  num < 5while (num < 5) {  // 3. 循环体console.log(1);// 4. 改变自身, 不写还能执行, 但是是死循环, 电脑死机速度num++   }

2、课堂案例

2.1 计算1到100的累加和

案例分析

        /***  第一次循环*      num == 1    sum == 0*          符合 num < 101*          执行循环体  sum = sum + num     sum = 0 + 1     ===> sum == 1*          num++* *  第二次循环*      num == 2    sum == 1*          符合 num < 101*          执行循环体  sum = sum + num     sum = 1 + 2     ===> sum == 3*          num++* *  第三次循环*      num == 3    sum == 3*          符合 num < 101*          执行循环体  sum = sum + num     sum = 3 + 3     ===> sum == 6*          num++*/

        //  1 + 2 + 3 + 4 + 5 +.... + 99 + 100  ==> 5050var num = 1;   //定义开始变量var sum = 0;   //定义累加和的变量while (num < 101) {// 累加求和sum += num;num++;}console.log(sum);   // 5050

2.2 求 1~100 之间所有3的倍数的和

        var num = 1;   //定义开始变量var sum = 0;   //定义累加和的变量// 循坏遍历 求值while (num < 101) {// 判断三的倍数if (num % 3 == 0) {//累加求值sum += num;}num++;}console.log(sum);

二、do…while循坏

1、解释说明

      1. 初始化do {2. 循环体3. 改变自身} while (4. 结束条件)

        var num = 1;do {console.log(1);num++} while (num < 5);

2、do…while 和 while 的差异

1. do...while在首次执行的时候, 会先执行循环体, 然后判断
2. while在首次执行的时候, 会判断, 然后符合条件了在执行

        // do...while循环var num = 10;do {console.log('do...while循环执行')num++;} while (num < 5);// while循环var num1 = 10;while (num1 < 5) {console.log('while循环执行');num1++;}

3、do…while循环案例

案例要求

1. 首次加载页面的时候, 让用户输入密码
2. 如果密码正确, 在浏览器控制台打印 密码正确
3. 如果错误, 让用户重新输入密码

案例分析

1. prompt()浏览器提供的, 会在浏览器打开一个弹窗, 让用户输入内容
   • 点击确定, 返回用户输入的内容(字符串格式的)
   • 点击取消, 返回一个null
2. 第一个参数: 用户的提示信息
3. 第二个参数: 输入框默认文本

        var password;do {password = prompt('请输入密码') - 0;} while (password != 12345)console.log('密码正确')

三、for循坏

1、解释说明

语法:for (1. 初始化; 2. 结束条件; 3. 改变自身) {// 循环体}

        for (var i = 0; i < 3; i++) {console.log(1)}

2、求1到100的累加

        var sum = 0for (var i = 1, sum = 0; i < 101; i++) {sum += i// console.log(i)}console.log(sum)

四、for循环嵌套

1、解释说明

        // 外层 for 循环for (var i = 0; i < 3; i++) {   // 内层 for 循环console.log(i);for (var k = 0; k < 3; k++) {   console.log(k);}}

2、for循环嵌套案例

        // 外层循环, 控制有多少行for (var k = 0; k < 9; k++) {   // 内层循环, 控制一行有多少个(控制有多少列)for (var i = 0; i < 9; i++) { document.write('*');}document.write('
');}

3、九九乘法表

        for (var j = 1; j <= 9; j++) {for (var i = 1; i <= j; i++) {document.write(`${i} * ${j} = ${i * j} `);}document.write('
');}

🤩 美化

代码优化

        for (var j = 1; j <= 9; j++) {document.write('
');for (var i = 1; i <= j; i++) {document.write('');document.write(`${i} * ${j} = ${i * j} `);document.write('');}document.write('
');}

五、 break 和 continue 关键词

1、break 和 continue的区别

1. JavaScript中的while循环，不支持continue关键词
2. break 终止一切，即终止关键词
   • 😥 作用1：终止本次循环break关键词之后程序的执行
   • 😥 作用2：终止本次循环之后循环的执行
3. continue 跳出一次循环，即跳出关键词
   • 😥 作用1：终止本次循环continue关键词之后程序的执行
   • 😥 作用2：继续本次循环之后循环的执行
4. break关键词一般用于死循环程序的执行

2、求水仙花数三次自幂数

        // 将判断一个数值是不是水仙花数的程序 定义在循环中for( var i = 100 ; i <= 999 ; i++ ){// 获取每一位上的数值var a = parseInt(i / 100);var b = parseInt(i % 100 / 10);var c = i % 10;// 判断立方和是不是数值本身if (Math.pow(a, 3) + Math.pow(b, 3) + Math.pow(c, 3) === i) {// 如果 每位上的数值立方和 是 这个数值本身 判断 是 水仙花数console.log(`数值${i}是水仙花数`);}}