day4

循环

循环重复执行某段代码。

while循环语法

<script>
while(循环条件){
   要重复执行的代码(循环体)
}
    </script>

循环三要素：

变量初始值；
终止条件；
变量需要改变。

示例：

    <script>
        // 1.变量初始值
        let i = 1;
        // 2.终止条件（没有加这个会变成死循环）
        while(i <= 8){
            document.write(`这个是第${i}循环`);
            // 3.变量需要改变(用自增或者自减)
            i++
        }
    </script>

while循环案例

循环课堂案例-循环用户输入的次数

    <script>

        //1. 循环用户输入的次数，先让用户输入
        let num = +prompt("想要循环的次数");
        // 2.变量的初始量
        let i = 1
        //3. 循环终止条件
        while (i <= num) {
            document.write(`月薪过万<br>`);
            // 4.变量改变
            i++
        } 
    </script>

循环课堂案例-计算1加到100的总和并输出

    <script>
        // 计算1加到100的总和并输出 1+2+3+4....
        let i = 1;
        let sum = 0;  //总和
        while (i <= 100) {
            // 1次循环 i = 1 ；sun = 0 + 1 =1
            // 2次循环 i = 2 ；sun = 1 + 2 =3
            // 1次循环 i = 3 ；sun = 3 + 3 =6
            sum = sum + i;
            i++
        }

        // 以上代码可以简写：
        // sum += i++;



        console.log(`1-100的综合是`,sum)
    </script>

循环课堂案例-计算1加到100的偶数的总和

    <script>
        // 求1-100的偶数和 ：2+4+6+8+10...
        // 去判断当前是不是偶数，对2 取整 求余为0的是偶数

        let sum = 0;  //总和
        let i = 1;
        // 终止条件 加到100以内
        while(i <= 100){
            // 只循环加偶数的
            if(i % 2 === 0){
                
                sum += i
            }
            // 变量改变
            i++
        }
        console.log(`偶数总和是`,sum)
    </script>

循环课堂案例- 弹窗循环

    <script>

        // 需求 弹窗跳出爱我吗，爱的话就结束。不是就一直问
        // 分析 prompt 一直被执行，肯定在循环里面
        // 决定循环的条件

        // 1 定义 初始变量  
        let str;
        //  2.判断的条件： 循环的条件是 不爱的时候 所以是 str！== “爱”
        while(str !== "爱"){
            // 弹窗
            str = prompt('你爱不爱我？')
        }
    </script>

课堂案例-取款机

for循环

for循环也是重复执行代码。

好处：把声明起始值，循环条件，变化值写在一起，让人一目了然。

语法：

  <script>
     for(声明记录循环次数的变量；循环条件；变化值){
         循环体
}
    </script>

示例：打印显示1-100的数值

<script>
for(let num = 1; num <= 100; num++){
            console.log(num)
        }
</script>

for循环案例

1-100偶数和

    <script>
        let sum = 0; 
        for (let num = 1; num <= 100; num++) {
            if(num % 2 === 0){
                sum += num
            }
            console.log (sum);          
        }
    </script>

500个星星

    <script>
       
        for(let num = 1;num <= 500;num++){
            document.write("⭐")
        }
    </script>

循环结束

continue : 结束本次循环，继续下次循环。

下面案例：

<script>
        //continue  结束本次循环   继续下次循环
        for (let index = 1; index  <= 10; index++){
            //当前index 不是偶数的
            if(index % 2 !== 0){
               // console.log(index);  //打印台输出显示1.3.5.7.9（奇数）

             continue;  //不是偶数的都跳过，所以只循环偶数，显示2.4.6.8.10
            }
            console.log (index)
        }
  </script>

break ：跳出所在的循环，打断整个循环。下面案例：

<script>   
          //break ：跳出所在的循环，打断整个循环。
        for (let num = 1; num <= 10; num++){
            //如果当前num =5 ，就不再往下循环了，就终止循环了
            if(num === 5){
                break;  //5之后的都不会再循环，所以打印台显示1.2.3.4
            }
            console.log(num);
        }
    </script>

循环嵌套

应用场景：假如每天记xx个单词，xx天后能记住多少个单词？

    <script>
        //要背几天，且一天要背几个，由用户输入
        let num1 = +prompt('想要背几天')
        let num2 = +prompt('一天要背几个')

        //外面这个循环是天数
        for(day = 1; day <= num1; day++){
            document.write(`第${day}天<br>`);
            //里面这个循环是单词数
            for(i = 1; i <= num2; i++){
                document.write(`背第${i}个单词<br>`);
            }
        }
    </script>

while和for循环的区别

当如果明确了要循环的次数，推荐使用for循环；
当不明确循环次数的时候，推荐使用while循环。

JavaScript基础day4