Detailed explanation of for loop and double for loop in JavaScript

for loop

The for loop loops through the elements of an array.

grammar:

for (initialization variable; conditional expression; iteration statement) {
The code block to be executed;
}

Initialization variables: generally used to initialize and assign values to loop variables.
Conditional expression: As a loop condition, an expression containing comparison operators is used to limit the boundaries of the loop variable. If the value of the loop variable exceeds the limit, the execution of the loop statement is stopped.
Iteration statement: used to change the value of the loop variable, thereby controlling the number of loops, usually by increasing or decreasing the value of the loop variable.

For loop execution order:

// 1. Declare variables;
// 2. Determine the loop execution condition;
// 3. Code block execution;
// 4. Variable increment;

Example: Find the sum of even numbers from 1 to 100

var num=0
    for(var i=0;i<=100;i+=2){ //i+=2 means i=i+2
      num +=i         
    }
    console.log("Sum of even numbers: "+num)

Double for loop

Nested loops refer to the grammatical structure of defining another loop statement within a loop statement. For example, in a for loop statement, you can nest another for loop. We call such a for loop statement a double for loop.

grammar:

for (outer initialization variable; outer conditional expression; outer iteration statement) {
for (inner initialization variable; inner conditional expression; inner iteration statement) {
The code block to be executed;
}
}

The inner loop can be regarded as the execution statement of the outer loop
The outer loop executes once, and the inner loop executes all

The essence of the double for loop is:

The outer for loop controls the height (number of rows) of the loop;
The inner for loop controls the width of the loop (number of columns);

Example: Output the multiplication table

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

You can add some styles to make it more beautiful (add a span element to define the width of the body, change the span element to an inline-block element, and set its fixed width)

<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>

Summarize

This concludes this article about for loops and double for loops in JavaScript. For more information about JavaScript double for loops, please search previous articles on 123WORDPRESS.COM or continue browsing the following related articles. I hope you will support 123WORDPRESS.COM in the future!

You may also be interested in: