08-for循环

for循环基本使用

for循环语法

• 也是重复执行语法
• 好处：把声明起始值、循环条件、变化值写到一起，让人一目了然

for (声明记录循环次数的变量;循环条件;变化值) {
	循环体
}

或者

for (起始条件；退出条件；变化量) {
    循环语句
}

    <script>
        for (let i = 1; i <= 10; i++) {
            document.write('月薪过万 <br>')
        }
    </script>

案例：

    <script>
        // 利用for循环输出1~100岁
        for (let i = 1; i <= 100; i++) {
            document.write(`我今年${i}岁了 <br>`)
        }

        // 求1~100偶数累加和
        let sum = 0 
        for (let i = 1; i <= 100; i++ ) {
            // 筛选偶数
            if (i % 2 === 0 ) {
                sum += i
            }
        }
        document.write(sum)

        // 页面打印5颗小星星
        for (let i = 1; i <= 5; i++) {
            document.write('※')
        }
    </script>

• for循环最大的价值：循环数组（遍历数组）

• 需求：请将 数组 ['马超'，'赵云','黄忠','关羽','张飞'] 依次打印出来

•         let arr = ['马超','赵云','黄忠','张飞','关羽']
          // document.write(arr[1])
          // 利用循环打印
          for (let i = 0; i <= 4; i++) {
              document.write(arr[i])
          }
  

• arr.length 数组的长度 通过它可以告诉我数组里面有几个

• document.write(arr.length)
  5
  
  
          let arr = ['马超','赵云','黄忠','张飞','关羽']
          // document.write(arr[1])
          // 利用循环打印
          for (let i = 0; i < arr.length; i++) {
              document.write(arr[i])
          }
  

for循环和while循环有什么区别呢：

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

for循环嵌套

for (外部声明记录循环次数的变量； 循环条件； 变化值) {
	for (内部声明记录循环次数的变量； 循环条件； 变化值) {
		循环体
	}
}


for (起始条件；退出条件；变化量) {
    循环语句
}

• 一个循环里再套一个循环，一般用在for循环里

案例

• 案例：

    <script>
        for ( let i = 1; i < 6; i++) {
            for ( let j = 1; j < 6; j++) {
                document.write('红')
            }
        }
        // 外面循环一次，里面循环执行全部 （5次）
    </script>

案例：每天记5个单词，3天能记住多少个单词

    <script>
        for ( let i = 1; i < 4; i++) {
            document.write(`第${i}天<br>`)
            for ( let j = 1; j < 6; j++) {
                document.write(`记住第${j}个单词<br>`)
            }
        }
        // 外面循环一次，里面循环执行全部 （5次）
    </script>

案例：打印五行五列小星星

    <script>
        for ( let i = 1; i < 6; i++) {
            for (let j = 1; j < 6; j++) {
                document.write('★')
            }
            // 上边5个星星打完再执行下面语句进行换行
            document.write('<br>')
        }
    </script>

案例：打印倒三角星星

    <script>
        for ( let i = 1; i < 6; i++) {
            for (let j = 1; j <= i; j++) {
                document.write('★')
            }
            document.write('<br>')
        }
    </script>

案例：九九乘法表

    <script>
        for ( let i = 1; i < 10; i++) {
            for (let j = 1; j <= i; j++) {
                document.write(`${j} x ${i} = ${j * i} &nbsp;`)
            }
            document.write('<br>')
        }
    </script>