js 循环语句

140 阅读3分钟

循环语句

  • 什么是循环语句
    • 根据某些给出的条件,重复执行同一段代码
  • 循环必须要有某些固定的内容组成
    • 初始化

    • 条件判断

    • 要执行的代码

    • 自身改变

小例子

需求:
     *          执行 500 次
     * 
     *          解决方案1: 手写 500次
     *                  弊端:
     *                      麻烦
     *                      将来如果修改新的需求 更加麻烦
     *          解决方案2: 利用循环语句完成
     *                      也就是说用 JS 帮我们 重复的执行某一件事(某一段代码)
     * 
     *          根据给出的某一些条件 重复执行某一段代码

while 循环语句

  • while,中文叫 当…时,其实就是当条件满足时就执行代码,一旦不满足了就不执行了
  • 语法 while (条件) { 满足条件就会执行 }
  • 因为满足条件就执行, 所以我们写的时候一定要注意, 就是设定一个边界值, 不然就一直循环下去了, 简称: 死循环, 电脑卡死的时间根据电脑性能有所不同, 建议不要尝试
// 1. 初始化条件
var num = 0
// 条件判断
while (num < 10) {
    // 3. 要执行的代码
    console.log('当前 num 的值是: ', num)
    // 4. 自身改变
    num += 1    // 如果没有这行代码, 那么自身就没有改变, 条件将会一直满足, 代码也就会一直执行
}

总结 while 循环

     *      不管什么循环都必须有以下几个内容组成
     *          1. 初始化
     *          2. 条件判断
     *          3. 要执行的代码
     *          4. 自身的改变
     *              * 第四步如果不写, 那么这个循环就是一个 死循环
     *              * 结束的时候 就是 电脑 冒烟的时候

案例详细分析1

image.png

案例详细分析2

image.png

do...while 循环语句

  • 是一个和 while 循环类似的循环
  • while 会先进行条件判断, 满足就执行, 不满足就直接不执行了
  • do...while 的循环是 先不管条件, 先执行一次, 然后再开始进行条件判断
  • 语法: do { 要执行的代码 } while (条件)
// 1. 初始化
var num = 10;
do {
    // 3. 要执行的代码
    console.log('我执行了一次')
    // 4. 自身改变
    num += 1
// 2. 条件判断
} while (num < 10)

总结 do while 循环

     *  do...while 循环
     * 
     *      while (条件) {条件成立循环执行的代码}
     *      do {要循环执行的代码} while (条件)
     * 
     *      区别:
     *          while: 会先判断条件, 如果条件成立那么在开始执行循环
     *          do...while: 不管条件是否成立, 先执行一次循环的代码, 然后判断条件是否成立, 决定是否开启下一轮循环

do while 写法

             // 1. 初始化
        var num = 10086
        do {
            // 3. 循环要执行的代码
            console.log(num)
            // 4. 改变自身
            num++
        } while (num < 5)  // 2. 判断条件

        console.log(num)

案例详细分析

image.png

for 循环语句

  • 和 while do while 循环都不太一样的一种循环结构
  • 但道理是和其他两种一样的, 都是循环执行代码的
  • 语法: for (var i = 0; i < 10; i++) { 要执行的代码 }
// 把初始化, 条件判断, 自身改变, 都统一写在了一起
for (var i = 1; i <= 10; i++) {
    console.log(i)  // 会打印 1~10
}
// 初次使用时会觉得有一点繁琐与不习惯, 但是用起来比较好用

总结 for 循环

     *  for 循环
     * 
     *      写法和另外两个不太一样, 但是非常好用
     * 
     *      for (1. 初始化   2. 判断条件   4. 改变自身) { 3. 循环要执行的代码 }
     *      需要定义多个变量写法是var b, c, d, e

案例总结

image.png

image.png

image.png

image.png

image.png

循环嵌套的书写

  • 循环嵌套其实就是一个循环内部又写了一个循环
for (var i = 0; i < 3; i++) {   // 这个循环称为 外层循环
    for (var k = 1; k < 4; k++) {   // 这个循环称为 内层循环
        /**
         * 重点!!!
         *          两个循环的循环变量不能相同, 会有冲突
        */
    }
}
  • 嵌套循环案例 --求质数
 <script>
        /**
         *  求 1~30 中的所有质数
         * 
         *      如果你能够判断一个数字是不是质数, 那么你就能够完成上述案例
         *          
         * 
         *      除了1和它本身, 没有能够整除的数字
         * 
         *          7   (是质数)
         *              1~7 (除了1和它本身 就剩下 2~6)
         *              7 % 2 !== 0
         *              7 % 3 !== 0
         *              7 % 4 !== 0
         *              7 % 5 !== 0
         *              7 % 6 !== 0
         * 
         *          8   (不是一个质数)
         *              1~8  (除了1和它本身 就剩下 2~7)
         *              8 % 2 === 0
         *              8 % 3 !== 0
         *              8 % 4 === 0
         *              8 % 5 !== 0
         *              8 % 6 !== 0
         *              8 % 7 !== 0
         * 
         *          9   (不是一个质数)
         *              1~9   (除了1和它本身 就剩下 2~8)
         *              9 % 2 !== 0
         *              9 % 3 === 0
         *              9 % 4 !== 0
         *              9 % 5 !== 0
         *              9 % 6 !== 0
         *              9 % 7 !== 0
         *              9 % 8 !== 0
         * 
         *      假设 数字 为 n
         *          1. 找到 2~n-1 的所有数字
         *          2. 找有没有能够和 n 完成 整除的 数字
         *                  有 代表 不是质数
         *                  没有 代表 是质数
        */


        // 当前案例为 判断一个数字是不是质数=============================================

        // 假设 数字 为 n
        // var n = 6
        // var sum = 0 // 用于完成计数器, 当 for 循环内部的 if 语句 执行的时候, 会改变 sum 的值

        // // 1. 找到 2~n-1 的所有数字
        // for (var i = 2; i < n; i++) {

        //     // 2. 找有没有能够和 n 完成 整除的 数字
        //     if (n % i === 0) {
        //         // console.log(i, '当你看到我的时候 说明有一个数字能够和', n, '完成整除')

        //         // 当前 分支内 如何修改 sum 的值(修改为什么)  并不重要, 重要的是 不能等于 初始值
        //         sum++
        //         // sum = 100
        //         // sum = true
        //     }
        // }

        // // 只要 当前 sum === 0 就证明 上述的 循环内的分支没有执行过
        // if (sum === 0) {
        //     console.log(n, '是一个质数')
        // }
        // =============================================================================


        // 求 1~30 以内的所有质数

        // 当前循环只是拿到了 1~30 的所有数字, 没有任何特殊含义, 但是这样写 会将 数字 1 也算作 质数
        for (var n = 1; n < 31; n++) {  
            var sum = 0 // 用于完成计数器, 当 for 循环内部的 if 语句 执行的时候, 会改变 sum 的值

            // 1. 找到 2~n-1 的所有数字
            for (var i = 2; i < n; i++) {
                // 2. 找有没有能够和 n 完成 整除的 数字
                if (n % i === 0) {
                    sum++
                }
            }

            // 只要 当前 sum === 0 就证明 上述的 循环内的分支没有执行过
            if (sum === 0) {
                console.log(n, '是一个质数')
            }
        }


        /**
         *  循环嵌套 其实就是 在一个 for 循环中, 又书写了一个 for 循环
         * 
         *  注意点就是 两个 循环 初始化的变量 不要相同
        */
    </script>