ES6中的常见数组遍历方式笔记-(forEach, map, filter, some和every,find,findIndex)

1、forEach

forEach可以说是for循环的代替品，没有任何返回值。

2、map

map和forEach类似，最大的区别是会返回一个全新的数组。不会改变原数组。

 var arr = [1, 2, 3, 4, 5]     
 let newArr = arr.map(num => num+1) 
 console.log(newArr) //  [2, 3, 4, 5, 6]


 var arr2 = [1, 2, 3, 4, 5]     
 let newArr2 = arr2.map(num => {return 'new' + num}) 
 console.log(newArr2) //  ['new1', 'new2', 'new3', 'new4', 'new5']

 3、filter

filter中文是过滤，特别适用于提取一个数组中符合条件的数组。

每轮遍历返回一个布尔值，结果为true的元素会被添加到新数组中，最终filter将返回这个新数组。

 var arr = [1, 2, 3, 4, 5]     
 let newArr = arr.filter((num) => {return num < 3}) 
 console.log(newArr) //  [1, 2]

 4、some和every

some和every可以说是一类，some（有些）、every（每个），所以some只要一个满足条件就为true，every需要都满足才会返回true。

some() 方法

用于检测数组中的元素是否满足指定条件。
如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。
如果没有满足条件的元素，则返回false。

every() 方法

用于检测数组所有元素是否都符合指定条件。
如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。
如果所有元素都满足条件，则返回 true。

 //some
 var arr = [1, 2, 3, 4, 5]     
 let newArr = arr.some((num) => {return num < 3}) 
 console.log(newArr) //  true

 //every
 var arr2 = [1, 2, 3, 4, 5]     
 let newArr2 = arr2.every((num) => {return num < 3}) 
 console.log(newArr2) //  false

5、find、findIndex、indexOf

find()方法

可用来查找数组中符合条件的元素，返回符合条件的元素。

findIndex()方法

可用来查找数组中符合条件的元素，返回符合条件的元素在数组中的索引。

indexOf()方法

可用来查找数组中指定某个元素，返回所在数组中的索引，如果没有找到则返回-1。

//find()
const numbers = [1, 3, 5, 7, 9];
const result = numbers.find(num => num > 6);
console.log(result); // 返回符合条件的值：7

//findIndex()
const numbers = [1, 3, 5, 7, 9];
const result = numbers.findIndex(num => num > 6);
console.log(result); // 返回符合条件值的索引：3

//indexOf()
const numbers = [1, 3, 5, 7, 9];
const result = numbers.indexOf(7);
console.log(result); // 返回某一特定值所在数组里面的索引：3

6、for in 、for of 

for in（ES1）

for in和for循环方式历史悠久，从ECMAScript 1就被支持。
for in 用来循环数组不是一个合适的选择。迭代的是属性key，不是值。
由于属性 key 是字符串，迭代出的元素索引是 string,不是 number，不能直接进行运算，如下

var arr = [1,2,3]
    
for (let index in arr) {
  let res = index + 1
  console.log(res)
}
//01 11 21

for of（ES6）

再来说说ES6 中的 for of
for of遍历的是数组元素值，而且for of遍历的只是数组内的元素，不包括原型属性和索引

var arr = [1,2,3]
arr.a = 123
Array.prototype.a = 123
    
for (let value of arr) {
  console.log(value)
}
//1 2 3

for of适用遍历数/数组对象/字符串/map/set等拥有迭代器对象（iterator）的集合，但是不能遍历对象，因为没有迭代器对象。

但如果想遍历对象的属性，你可以用for in循环（这也是它的本职工作）或用内建的Object.keys()方法 

var myObject={
　　a:1,
　　b:2,
　　c:3
}
for (var key of Object.keys(myObject)) {
  console.log(key + ": " + myObject[key]);
}
//a:1 b:2 c:3

应用

1、提取两个数组中相同的值作为一个新数组

 
let permissionList = [
      'invoice_order_list',
      'report_station_xie',
      'report_station',
      'Electronic_fence_list'
      'report_driver'
 ]
 let reportAuth = [
      'report_car',
      'report_carReduction',
      'report_carrierRoute',
      'report_station_xie',
      'report_station',
      'report_driver'
 ]
 let newreportAuth = permissionList && permissionList.filter((el) => {
    return reportAuth.includes(el)
 })
 console.log(newreportAuth)

//newreportAuth
['report_station_xie', 'report_station', 'report_driver']