“This is the sixth day of my participation in the August More Text Challenge.

preface

The first common traversal is for (var I =0; I

{}).
,>

Common methods for array traversal

The following sections describe common looping methods in arrays, as well as performance comparisons

The for loop

` let arr = [1, 2, 3]; ` for(let i=0; i<arr.length; i++){ console.log(i,arr[i])` }Copy the code

The simplest one is also the most frequently used, but there is room for improvement

for(j = 0,len=arr.length; j < len; j++) { }
Copy the code

Use temporary variables to cache the length and avoid fetching the array length repeatedly. The optimization effect is more obvious when the array is large.

Array forEach loop

Let arr = [1, 2, 3]; arr.forEach(``function``(i,index){ console.log(i,index) }) // 1 0 // 2 1 // 3 2Copy the code

ForEach loop, a loop that loops through each element of an array and takes an operation, returns no value, does not need to know the length of the array, and takes three arguments, only the first is required, representing the value of the current index.

Also note that the forEach loop cannot stop until all elements have been called. It does not have a break statement. If you must stop, you can try a try catch statement. If you use this method a lot, it’s a good idea to create a custom forEach function in your library.

Array map () method

Let arr = [1, 2, 3]; Let temp = arr.map((item,index)=>{//item first element //index)})Copy the code

The map() method returns a new array whose elements are the values processed by the call to the original array element. While it’s more elegant to use, it’s not nearly as efficient as Foreach

Object traversal

for in

let obj = {name:'liu',age:'je'}
for(let i in obj){
 console.log(i,obj[i])
}
// name liu
// age je
Copy the code

The for in loop is mainly used to iterate over ordinary objects. I is the key value of the object, and obj[I] is the value. Most of the time, when you iterate over groups of numbers, you can do the same thing. Instead of the numeric subscripts that arrays require, this means that in some cases, string operations can occur, resulting in data errors, such as: ’52’+1 = ‘521’ instead of 53 as we need.

In addition, the for in loop will not only iterate through its own properties, but also find prototype, so it is best to add a judgment inside the loop, such as obj[I].hasownProperty (I), so as not to iterate through too many unnecessary properties.

For of(ES6 New)

In ES6, for-of traversal is added. It is designed to iterate over collections of arrays of classes, such as DOM NodeList objects, Maps and sets, and even strings. The official line:

for… The of statement creates an iteration loop over iterable objects (including Array, Map, Set, String, TypedArray, Arguments, and so on), calling a custom iteration hook with an execution statement for each property value of a different property

// for (); // for (); For (let I of arrTmp){console.log(I)} // Output "value1" "value2" "value3" // for-of traverse Map object let iterable = new Map([["a", 1], ["b", 2], ["c" , 3]]); ` for ( let [key, value] of iterable) { console.log(value); } // output 1 2 3 // for-of let iterable = "China"; for ( let value of iterable) { console.log(value); } // output "c" "h" "I" "n" "a" "middle" "country"Copy the code

The object.keys () method (not compatible with earlier versions of IE)

/ * * * * Object. The keys () returns an array of keys * * * * / / / an array type let arr = [" a ", "b", "c"); console.log(Object.keys(arr)); / / (3) [' 0 ', '1', '2'] ` / / class array object ` let anObj = {100: ` ` 'a' ` `, 2: ` ` 'b' ` `, 7: ` ` 'c' ` `}; console.log(Object.keys(anObj)); / / (3) [' 2 ', '7', '100'] / / general object let xyz = {z: "z", x: "XXX", y: "yyy" `}; console.log(Object.keys(xyz));Copy the code

Recommended uses of javascript’s native traversal methods:

  • Iterate through the array with the for loop
  • Iterate over the object with for-in
  • Traversing array objects with for-of (ES6)
  • Keys () gets a collection of Object property names