Loop traversal and out of loop traversal

The blog instructions

The information involved in the article comes from the Internet collation and personal summary, meaning is the summary of personal learning and experience, if there is any infringement, please contact me to delete, thank you!

instructions

When you think of a loop, naturally you think of for. While will not be discussed here (because it has a loop exit condition), but in fact Js loop is more than this for, here to talk about several types of Js for loop in detail.

When you think about breaking out of loops, three keys immediately come to mind: break, return, and continue. In business, you also need to exit loops while iterating.

The for class iterates through the array

1. For loop

const arr = [1.2.3.4.5.6]
for (let i = 0; i < arr.length; i++) {
  console.log(i)
}
Copy the code

This is one of the most simple, is also the use of the highest frequency of a kind, performance is relatively better than the other, so see others source code with this do not XXX, think twice!

However, there is one detail that can be optimized. The length can be stored as a temporary variable, which does not need to be calculated every time. The improvement is more obvious when there is a large amount of data.

const arr = [1.2.3.4.5.6]
for (let i = 0, len = arr.length; i < len; i++) {
  console.log(i)
}
Copy the code

2, for… In circulation

const arr = [1.2.3.4.5.6]
for (let i in arr) {
  console.log(i)
}
Copy the code

Apply for to arrays. The in loop will contain not only all numeric indexes, but also all enumerable attributes. So it’s used for traversal of objects. And the efficiency of loop traversal in this way is the lowest

3. ForEach loop

const arr = [1.2.3.4.5.6]
arr.forEach((item, index) = > {
  console.log(item)
})
Copy the code

ForEach comes with arrays and is used more frequently, but less efficiently than for

Because forEach is a built-in array, we need to make a change to other similar array types, which are weaker than forEach

const arr = [1.2.3.4.5.6]
Array.prototype.forEach.call(arr, (item) = > {
  console.log(item)
})
Copy the code

4. Map traversal

const arr = [1.2.3.4.5.6]
arr.map((item) = > {
  console.log(item)
})
Copy the code

The more the map method is used, it is very convenient and elegant to use, but the efficiency is low (compared with forEach).

5, for… Of traversal

const arr = [1.2.3.4.5.6]
for (let i of arr) {
  console.log(i)
}
Copy the code

for… “Of” is a new es6 syntax that performs better than “for”. In is better, but not as good as a regular for loop

Jump out of the loop

The above mentioned three key words that come to mind when breaking out of loops: break, return, continue, for, and for… In responds to all three keywords, but forEach does not. Let’s talk about these three key words

The for loop breaks out of the loop

Break: The break statement causes the running program to immediately exit the innermost loop or a switch statement.
Continue: The continue statement is similar to the break statement. The difference is that instead of exiting a loop, it starts a new iteration of the loop. The continue statement can only be used inside a loop of a while, do/while, for, or for/in. Using it elsewhere will cause an error.
Return: The return statement is used to specify the value returned by the function. A return statement can only appear inside a function, appearing anywhere else in the code causing a syntax error.

const arr = [1.2.3.4.5.6]
for (let i = 0; i < arr.length; i++) {
  console.log(i)
  if (i === 2) {
    return;
    // breack;}}Copy the code

ForEach breaks out of the loop

It doesn’t respond to this out-of-loop statement in forEach, so it doesn’t work, but make sure it works, okay? Line!

There is a SAO operation, directly to a throw wrong, I do not terminate, I throw wrong!

try {
  const arr = [1.2.3.4.5.6]
  // Execute to the fourth time, end the loop
  arr.forEach(function(item,index){
    if (item === 4) {
       throw new Error("EndIterative");
    }
    console.log(item);/ / 1, 2, 3
  });
} catch(e) {
   if(e.message! ="EndIterative") throw e;
};
// The following code does not affect the continuation of execution
console.log(10);
Copy the code

But this is not recommended, we don’t need to, just use for loop, it’s fast

Thank you

Universal network

As well as hard-working self, personal blog, GitHub test, GitHub

Public number – return child mo, small procedure – small return blog

Loop traversal and out of loop traversal