js遍历数组篇（二）-遍历数组的各种方法

1. forEach

上一篇写过了，链接：js遍历数组篇（一）-forEach

2. for...in/for...of

之前写的遍历对象篇里介绍过了 不再举例

特点： for...in...会遍历私有属性、原型属性 for...of...走的是Symbol.Interator接口，数组本身自带

主要介绍一下几种方法：

3. map

和forEach类似

相同：不改变原数组

区别：map会返回新数组；forEach无返回值（undifined）

let arr = [1,2,3,4,5,6]

let arr1 = arr.map(x => x + 1)
console.log(arr); // [ 1, 2, 3, 4, 5, 6 ] 不改变原数组
console.log(arr1); // [ 2, 3, 4, 5, 6, 7 ]

4.reduce

回调函数第一次执行时， x 和y的取值有两种情况： 如果调用reduce()时提供了initialValue，x取值为initialValue，y取数组中的第一个值； 如果没有提供 initialValue，那么x取数组中的第一个值，y取数组中的第二个值。

(这个方法比较复杂 更详细的建议看mdn)

let arr = [1,2,3,4,5,6]

let res1 = arr.reduce((x, y) => {
  console.log(x + y); // 3 6 10 15 21 
  return x + y 
})
console.log(res1); // 21

let res2 = arr.reduce((x, y) => {
  console.log(x + y); // 2 4 7 11 16 22
  return x + y
}, 1) // initialValue为1 从1开始累加
console.log(res2); // 2

5.filter

过滤

let arr = [1,2,3,4,5,6]

let arr3 = arr.filter(x => x > 3)
console.log(arr); // [ 1, 2, 3, 4, 5, 6 ] 不改变原数组
console.log(arr3); // [ 4, 5, 6 ]

6.every/some

some方法：对数组的每一项运行回调函数，有一项返回true，就返回true

every方法：对数组的每一项运行回调函数，每一项都返回true，才返回true

let arr = [1,2,3,4,5,6]
// every
let a = arr.every(x => x > 3)
console.log(a); // false
a = arr.every(x => x < 10)
console.log(a); // true

// some
let a = arr.some(x => x > 4)
console.log(a); // true

7.find/findIndex/includes/indexOf/lastIndexOf

这些方法用处相似，写在一起方便理解记忆

let arr = [1,3,5,7,9,9]
// find
let a = arr.find(x => x > 4)
console.log(a); // 5 (返回第一个符合要求的元素值)

// findIndex
let b = arr.findIndex(x => x > 4)
console.log(b); // 2 (返回第一个符合要求的元素下标)


// includes
console.log(arr.includes(9)); // true

// indexOf
console.log(arr.indexOf(9)); // 4 有则返回第一个符合要求的元素下标
console.log(arr.indexOf(10)); // -1 没有则返回-1

// lastIndexOf
console.log(arr.lastIndexOf(9)); // 5 有则返回最后一个符合要求的元素下标
console.log(arr.lastIndexOf(10)); // -1 没有则返回-1