How to do a loop in JavaScript

As a widely used programming language, one of the most commonly used features of JavaScript is the loop structure, which provides developers with a convenient means to implement various logics and algorithms. This article will introduce readers to several commonly used loop structures and their application scenarios in JavaScript.

1. while loop

The while loop is the most basic loop structure. Its syntax structure is as follows:

while(condition){
  // statements to be executed
}

where condition represents the condition of the loop, if If condition is true, the statements in the loop are executed. Before the loop is executed, it will check whether the condition is true. If the condition is false, the statements in the loop body will not be executed.

While loops can be applied to various scenarios, such as repeatedly performing certain operations based on user input, or filtering out elements that meet certain conditions from an array or object, etc.

The following is a simple example that will output the numbers 1~5:

let i = 1;
while(i <= 5){
  console.log(i);
  i++;
}

2. do-while loop

do-while loop and while The difference with loops is that the do-while loop will first execute the loop body once and then check whether the loop condition is true. If the loop condition is true, the loop body is executed repeatedly, otherwise the loop is exited.

The syntax is as follows:

do {
  // statements to be executed
}while(condition);

Similarly, condition represents the condition of the loop. Here is an example, which will output numbers 1~5:

let i = 1;
do {
  console.log(i);
  i++;
}while(i <= 5);

3. for loop

The for loop is usually used to iterate elements in an array, and its syntax is as follows:

for(init; condition; iterator){
  // statements to be executed
}

where init represents the statement to be executed at the beginning of the loop, condition represents the condition of the loop, and iterator represents the statement to be executed after each iteration.

The following is an example, which will output the numbers 1~5:

for(let i = 1; i <= 5; i++){
  console.log(i);
}

In the for loop, you can also use the break and continue statements to control the flow of the loop. The break statement is used to break out of the loop, and the continue statement is used to skip the current iteration and execute the next iteration.

The following is an example of a for loop with a break statement, which will output the numbers 1~4:

for(let i = 1; i <= 5; i++){
  if(i == 5){
    break;
  }
  console.log(i);
}

4. for-in loop

for The -in loop is used to traverse the properties of an object. Its syntax is as follows:

for(property in object){
  // statements to be executed
}

where property represents the property name currently traversed, and object represents the object to be traversed.

The following is a simple example that will iterate through all properties of an object and output their values:

let person = {
  name: "Tom",
  age: 20,
  city: "New York"
};

for(let property in person){
  console.log(person[property]);
}

It should be noted that when using a for-in loop to traverse an array, return are not the elements of the array, but their indices.

5. for-of loop

The for-of loop is a new syntax in ES6, which is used to traverse iterable objects, such as arrays and strings. The syntax is as follows:

for(variable of iterable){
  // statements to be executed
}

where variable represents the element currently traversed, and iterable represents the iterable object to be traversed. Here is an example that will output all the characters in a string:

let str = "hello, world";
for(let char of str){
  console.log(char);
}

It should be noted that when traversing the array, using a for-of loop can avoid using the index variable in the for loop and increasing the code readability.

This article introduces several commonly used loop structures in JavaScript and their application scenarios. They can help developers implement various logic and algorithms and improve code readability and efficiency.

The above is the detailed content of How to do a loop in JavaScript. For more information, please follow other related articles on the PHP Chinese website!