No one can only use foreach to traverse arrays, right?

start

• Yes , I am .

---

• The cause of the matter is , A long time ago , My big brother review Check out my code . After reading it, he gave me a comment .

  tomato , All the code you write about traversal is forEach A shuttle

• There are some historical reasons , In the final analysis, I am not proficient in mastering knowledge , Give yourself another chance today , Review the .

1. for

The basis of for Circulation mode

2. forEach

forEach() Method performs the given function once for each element of the array .

• Return value ：undefined;
• forEach() It does not modify the original array , however callback May be modified in ;
• forEach() Method by Ascending Execute once for each item in the array that contains valid values callback function , Items that have been deleted or uninitialized will be skipped ;
• In addition to throwing exceptions , There is no way to stop or jump out forEach() loop . If you need to stop or jump out of the loop ,forEach() Methods are not tools that should be used .
• Use promise or async Function as forEach() And so on callback Parameters , It's better to think more about the impact of execution sequence
• forEach() The scope of traversal is in the first call callback It will be determined before .

3. map

map() Method to create a new array , The result is that each element in the array is the return value after a call to the supplied function .

• Returns a new array , Do not modify the original array

• map The return value of the function is ： callback Return value after each execution （ Include undefined） Combine to form a new array

  4. filter

filter() Method to create a new array , It contains all the elements of the test implemented by the provided function .

• filter It doesn't change the original array , It returns the filtered new array .

5. some

some() Method to test if there are at least 1 Elements passed the provided function test . What it returns is a Boolean Type value .

• An array item satisfies the condition , Just go back to true.
• return true Will stop executing .
• some() The scope of traversal is in the first call callback It will be determined before .

6. every

every() Method to test whether all elements in an array can pass the test of a specified function . It returns a Boolean value .

• If you receive an empty array , This method will return... In any case true.
• When all elements meet the conditions, it will return true

7. find

find() Method returns the value of the first element in the array that satisfies the provided test function . Otherwise return to undefined.

8. findIndex

findIndex() Method returns the index of the first element in the array that satisfies the provided test function . If no corresponding element is found -1.

9. reduce

const array = [15, 16, 17, 18, 19]

function reducer(previous, current, index, array) {
    
  const returns = previous + current
  console.log(`previous: ${
      previous}, current: ${
      current}, index: ${
      index}, returns: ${
      returns}`)
  return returns
}

array.reduce(reducer, '12')

• Two parameters ： Callback function ; Initial value ( optional )
• The parameters of the callback function 1. Last executed return value ;2. Items in the current loop ;3. Indexes ;4. Array

10. for in

Traversing is the index of the array （ That is, the object of key）

11. for of

for of Traversing is the array element value

• It is recommended to use... When traversing objects for in , Used when traversing an array for of .
• for in What circulates is key（ also key The type is string）,for of What circulates is value.
• for of yes es6 Introduce new features , Repair the es5 Introduced for in Deficiency .
• for of You can't cycle through ordinary objects , Need to pass through Object.keys Use it with .

12. while && do while

while

var n = 0
var x = 0

while (n < 3) {
    
  n++
  x += n
}

do while

do statement
while (condition)

Create a loop that executes the specified statement , until condition The value is false. In execution statement After the test condition, So the designated statement At least once .

summary

There are so many front-end eight part essays , Who can stand it .

Take a deep breath , Simply touch it with me , It's very simple .

I write this article in the hope that when I encounter a scenario that needs to be traversed in the future , More options , Know the advantages and disadvantages , Choose the most appropriate way to traverse .

for example ：

1. Want to modify each item of the array and get a new array ==> map( New array )
2. You want to filter the array of qualified items in the array ==> filter( New array )
3. Want to determine whether the array has qualified items ==> some( Boolean value )
4. Want to determine whether the array meets a certain condition ==> every( Boolean value )
5. Traverse all items ==> forEach(undefined)
6. Find the element that meets a certain condition find ( Elements )
7. Find the element index that meets a certain condition findIndex( Indexes )
8. forwhiledo whilefor of Use as you like
9. reduce Functions are special , Just remember its parameters

end

• Just for personal review
• Actually, I write it down myself , The mastery of these methods has been greatly improved . Encourage each other