js array traversal Summary

1, for loop
using a temporary variable, the length cached, to avoid duplication of acquiring the array length, when the array is large optimization effect will be more obvious.

const arr=[1,2,3,4,5,6];
for(let i=0,len=arr.length;i<len;i++){
    console.log(arr[i]);
}

2, foreach traversing
each traverse the array, no return value, no effect on the original array, does not support IE

const arr=[1,2,3,4,5,6];
arr.forEach((item, index, arr) => {
    console.log(item);
});
//参数：value数组中的当前项, index当前项的索引, array原始数组；
//数组中有几项，那么传递进去的匿名回调函数就需要执行几次；

. 3, cycle map
returns a value, it may return
the map support return callback return value; return is valid, the array that corresponds to a change why (does not affect the original array, only the equivalent of the a clone of the original array, the array corresponding item changes that a cloned in a);

const arr=[1,2,3,4,5,6];
let tmp = arr.map((item, index, arr)=>{
    //console.log(item);
    return item+6;
});
console.log(tmp);   //Array [7,8,9,10,11,12]

4, for ... of traversal
can respond properly break, continue, and return statement

const arr=[1,2,3,4,5,6];
for (var value of arr) {
console.log(value);
}

5, filter traversal
does not alter the original array and returns a new array

var arr = [
  { id: 1, text: 'aa', done: true },
  { id: 2, text: 'bb', done: false }
]
console.log(arr.filter(item =>  item.done));
//或
console.log(arr.filter(function (item) {
          return item.done;
 }));

6, every traverse
every () is run on each item in the array to a given function, the function returns true if for each, it returns true.

const arr=[1,2,3,4,5,6];
let res = arr.every((item, index, array) => {
    return item > 3;
});
console.log(res);   //false

7, some traverse
some () function is specified for each item in the array operation, a Returns true if any of the function, it returns true.

const arr=[1,2,3,4,5,6];
let res = arr.every((item, index, array) => {
    return item > 3;
});
console.log(res);   //true

8, reduce traverse
reduce () method takes a function as an accumulator (ACC with), each value (left to right) in the array begins to reduce, to a final value.

const arr=[1,2,3,4,5,6];
let res = arr.reduce((a, b) => {
    return a+b;
});
console.log(res);

9, find traverse
find () method returns the first element in the array meet the conditions of the test function. Otherwise undefined

//es6
const arr=[1,2,3,4,5,6];
let res = arr.find((item, index) => {
    return item ==3;
});
console.log(res);  //3

//es5
var stu = [
    {name: '张三', gender: '男',age: 20},
    {name: '王小毛', gender: '男',age: 20},
    {name: '李四',gender: '男',age: 20 }
];
function getStu(element){
   return element.name == '李四'
}
console.log(stu.find(getStu));

10, findIndex traverse
for each element of the array, findIndex a callback method is invoked (using the index in ascending order) until the element returns true. Returns true as long as there is an element, findIndex returns the index of the element immediately returns true. If the array does not return true no elements findIndex -1.
findIndex not change the array of objects.

const arr=[1,2,3,4,5,6];
let res = arr.findIndex(el => el==4);
console.log(res);  //3

let res = [1,2,3].findIndex(x => x == 4);
console.log(res);   // -1

11, keys, values, entries traversing
ES6 provided three new methods - entries (), keys () and values () - used to traverse the array. They return a traverse object can be used for ... of traverse cycle, the only difference is that keys () Is the traversal key names, values () is a traversal of keys, entries It () is a key to traverse

for (let index of ['a', 'b'].keys()) {
   console.log(index);
} 
// 0 1

for (let elem of ['a', 'b'].values()) {
console.log(elem);
}   
// a b

for (let [index, elem] of ['a', 'b'].entries()) {
console.log(index, elem);
}
//0 "a"
//1 "b"