Home >Web Front-end >Front-end Q&A >What is the loop statement in javascript

What is the loop statement in javascript

WBOY
WBOYOriginal
2022-04-06 14:55:206479browse

JavaScript loop statement is a statement composed of two parts: a loop body and a termination condition. The loop body is a statement that is executed repeatedly, and the termination condition is a condition that determines whether it can continue to be repeated. JavaScript loop statements: 1. for statement; 2. for in statement; 3. while statement; 4. do while statement.

What is the loop statement in javascript

The operating environment of this tutorial: Windows 10 system, JavaScript version 1.8.5, Dell G3 computer.

What is the loop statement of JavaScript

In many practical problems, there are many repeated operations with regularity, so certain statements need to be repeatedly executed in the program.

A group of statements that are executed repeatedly is called the loop body. Whether it can continue to be repeated determines the termination condition of the loop. A loop structure is a process structure that repeatedly executes a certain program under certain conditions. The repeatedly executed program is called a loop body. A loop statement is composed of two parts: the loop body and the loop's termination condition. So let’s introduce our commonly used loop statements below.

JavaScript supports four different types of loops:

  • for: Traverse a code block multiple times

  • for/in: Traverse object properties

  • while: Loop a block of code when the specified condition is true

  • do/while: Loop when the specified condition is true A block of code

for statement

The syntax format of the for statement is as follows:

for (语句1; 语句2; 语句3) {
要执行的代码块
}

Statement 1 In the loop (code block ) before starting. Statement 1 is optional. If there is no statement, just write a semicolon. We usually initialize some variables in statement 1. The variable can be one or multiple. Multiple variables are separated by commas.

Statement 2 defines the condition for running the loop (code block). If the condition is true, enter the loop and execute the code block in the loop, otherwise, end the loop. Statement 2 is also optional. If there is no statement, just write a semicolon. However, it should be noted that if there is no statement, you need to write a break in the loop body. Otherwise, it will never end and it will become an infinite loop.

Statement 3 will be executed every time the loop (code block) is executed. Statement 3 is also optional, and the content of statement 3 can be written in the loop body.

Note a small detail, there is no semicolon at the end of statement 3.

Write a small example:

<p id="demo"></p>
<script>
        var text = "",i;
    
        for (i = 0; i < 5; i++) {
              text += "The number is " + i + "<br>";
        }
document.getElementById("demo").innerHTML = text;
</script>

Statement 1 sets a variable (var i = 0) before the loop starts.

Statement 2 defines the condition to run the loop (i must be less than 5).

Statement 3 will increment the value (i) after each execution of the code block.

for/in statement

The for/in statement is generally used to traverse the properties of an object. The syntax format is as follows:

for (属性名 in 对象) {
要执行的代码块
}

Write a small example:

<p id="demo"></p>
<script>
        var person = {name:"刘小妞", sex:"女", work:"自媒体"}; 
        var x,txt = "";
        for (x in person) {
          txt += person[x] + " ";
        }
document.getElementById("demo").innerHTML = txt;
</script>

x represents the attribute name, which can be defined arbitrarily, similar to a formal parameter. The attribute value is accessed in the form of object [attribute name], and the form object.attribute name cannot be used.

while statement

The syntax format of while is as follows:

while (条件) {
要执行的代码块
}

If the condition is true, the code block will be executed in a loop.

Write a small example:

<p id="demo"></p>
<script>
    var text = "";
    var i = 0;
    while (i < 10) {
      text += "<br>数字是 " + i;
      i++;
    }
document.getElementById("demo").innerHTML = text;
</script>

Note that if you are not writing an infinite loop, you must have statements in the loop body that can make the condition not true.

For example, in the above example, there is i in the loop body. When i increments to 10, the loop ends.

do/while statement

The syntax format of do/while is as follows:

do {
要执行的代码块
}
while (条件);

The do/while loop is a variant of the while loop.

This type of loop executes the block of code once before checking whether the condition is true, and then repeats the loop as long as the condition is true.

Write a small example:

<p id="demo"></p>
<script>
    var text = ""
    var i = 0;
    
    do {
          text += "<br>数字是 " + i;
          i++;
    }
    while (i < 10);  
    
document.getElementById("demo").innerHTML = text;
</script>

Related recommendations: javascript learning tutorial

The above is the detailed content of What is the loop statement in javascript. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn