JavaScript for循环与双重for循环基础教程

for循环

for循环主要用于遍历数组中的各个元素。

其基本语法结构如下：

for (初始化变量; 条件表达式; 迭代语句) { 需要执行的代码块； }

• 初始化变量：通常用于在循环开始前对循环变量进行初始赋值。
• 条件表达式：作为循环的判断依据，包含比较运算符，用于设定循环变量的边界。当变量值超出该边界时，循环终止。
• 迭代语句：用于更新循环变量的值，从而控制循环执行的次数，通常表现为变量的递增或递减操作。

for循环的具体执行顺序如下：

// 1. 声明变量； // 2. 判断循环执行条件； // 3. 代码块执行； // 4. 变量自增；

示例：求1-100的偶数和

var num=0
    for(var i=0;i<=100;i+=2){  //i+=2 意思为i=i+2
      num +=i         
    }
    console.log("偶数和:"+num) 

双重for循环

循环嵌套指在一个循环语句内部再定义另一个循环语句的结构。例如，在for循环中嵌套另一个for循环，这种结构被称为双重for循环。

其语法格式为：

for (外层初始化变量; 外层条件表达式;外层迭代语句) { for (内层初始化变量;内层条件表达式; 内层迭代语句) { 需要执行的代码块； } }

• 内层循环可视为外层循环执行过程中的一部分语句。
• 外层循环每执行一次，内层循环便会完整执行一遍。

双重for循环的核心实质在于：

• 外层for循环负责控制循环的高度（即行数）；
• 内层for循环负责控制循环的宽度（即列数）；

示例：输出九九乘法表

 for(var i= 0 ; i <=9 ; i++){
     for(var aa = 1 ; aa <i+1 ; aa++){
       document.write(aa+"*"+i+"="+i*aa);
     }
     document.write("<br />");
   } 

可以通过添加样式使输出更美观，例如添加span元素，定义body主体部分的宽度，并将span元素设置为inline-block行内块元素，同时设定其固定宽度。

<head>
<style> body{
    width:2000px;
  }
  span{
    display:inline-block;
    width:80px;
  } </style>
</head>
<body> 
<script> for(var i= 0 ; i <=9 ; i++){
     for(var aa = 1 ; aa <i+1 ; aa++){ document.write("<span>"+aa+"*"+i+"="+i*aa+"</span>");
     }
     document.write("<br />");
   } </script>
</body>

总结

到此这篇关于JavaScript中的for循环与双重for循环的文章就介绍到这了,更多相关JavaScript双重for循环内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站！