循环三子（循环结构语句）——for循环

最新推荐文章于 2022-05-13 18:10:59 发布

cap_xc

最新推荐文章于 2022-05-13 18:10:59 发布

阅读量417

点赞数

本文链接：https://blog.csdn.net/cap_xc/article/details/105025288

版权

在JS中，循环结构语句是非常重要的一部分，循环结构语句即：重复地执行一段代码，要注意的是他要有尽头，不能无穷的重复，否则会出现死机的状况。今天我们要说的就是循环结构语句三种中的一种，也是我们最常用的一种——for循环。
首先，既然是循环，那么循环的四要素肯定也是必不可少的，即：
1、有一个初始化变量
2、有条件判断
3、要重复执行的代码
4、改变初始化变量（不要写死循环）
了解for循环，那就要知道怎么写for循环，也就是for循环的语法：

					for（初始化变量；条件判断；自身改变）{
										要重复执行的代码
					}

注意，两两之间是用分号隔开的（；）
初始化变量就是我们使用var关键帧定义的变量，如：var i = 1

条件判断就是我们让它循环所处的范围，因为我们知道写循环代码不能无穷重复，所以得让它有一个范围，如：i < 9，如果i>或者=9，那么条件不成立，也就不会在进行循环

自身改变也就是我们循环四要素中的改变初始化变量，如果初始化变量不改变，那 i 就是一直为1，我们写了i <9，那 i 就永远不会大于9，这样就会变成死循环，就会出现死机的现象，所以要改变初始化变量，如何改变初始化变量呢，大家应该知道++运算符吧，我们写上 i++，那 i 就会让自己本身加一，循环一次就加1，这样在循环n次后，就会有某一次达到 i >=9的时候，循环也就完成了

如果有两个for循环进行嵌套的话，又会怎么发生循环呢。
如for（var i = 1；i <= 9；i++）{
for（var j = 1；j <= 9；j++）{

}
这个嵌套表达的是当 i 循环一次，j 循环9次，也就是当 i 为1时，j进行了9次循环，
i = 1，j = 1 2 3 4 5 6 7 8 9
i = 2，j = 1 2 3 4 5 6 7 8 9
以此类推，当 i 为9时，j = 1 2 3 4 5 6 7 8 9
循环就结束了
看到这个，我们是不是仿佛记起了那一年我们坐在教室中绞尽脑汁要背的九九乘法表呢！
所以，我们就可以用这个for循环来写我们的九九乘法表，具体代码如下：

      <!DOCTYPE html>
               <html lang="en">
               <head>
          <meta charset="UTF-8">
               <meta name="viewport" content="width=device-width, initial-scale=1.0">
                <title>Document</title>
              <style>
                  span{
        display: inline-block;
        border: 1px solid red;
        width: 130px;
        height: 30px;
        font-size: 20px;
        line-height: 30px;
        text-align: center;
    }
  </style>
      </head>
   <body>
<script>
    for(i=1;i<=9;i++){
        for(j=1;j<=i;j++){
            document.write('<span>'+i+'*'+j+'='+i*j+'</span>')
        }
        document.write('</br>')
    }
</script>
 </body>
   </html>

其中 j 为什么要<=i 呢，因为我们的九九乘法表是
1 * 1=1
1 * 2=2 2 * 2=4
…
也就是 i 为1的时候，j 只有一个为1，当 i 为2的时候，j 为 1 和 2，所以，j <= i

document.write的意思是在网页中显示，这样，我们的九九乘法表就写完了。

这就是今天的for循环语句的分享，希望大家能有所收获！