数组迭代遍历的方法

js常用的数组遍历方法有很多，尽可能记录比较全，包括ES6新增的方法，介绍下各个特点

目录

1.forEach()

2.map()

3.filter()

4.some()

5.every()

6.find()和findIndex()

7.reduce()和reduceRight()

---

1.forEach()

let arr = ['Mon', 'Tues', 'Wed', 'Thur', 'Fri', 'Sat', 'Sun'];
// 1.forEach方法
arr.forEach((item, index) => {
    console.log(item, index);
});

输出结果：

 特点：

1. 遍历整个数组
2. 对于空数组，则不执行回调函数，是我们使用比较频繁的一个遍历方法

2.map()

let arr = ['Mon', 'Tues', 'Wed', 'Thur', 'Fri', 'Sat', 'Sun'];
// 2.map方法
console.log('原数组：', arr);
arr = arr.map((item, index) => {
	return item + 'day';
});
console.log('map处理后的数组：', arr);

输出结果：

 特点：

1. 遍历整个数组
2. 返回值是一个新的数组
3. map() 不会对空数组进行处理
4. map() 也不会改变原始数组

3.filter()

let arr = ['Mon', 'Tues', 'Wed', 'Thur', 'Fri', 'Sat', 'Sun'];
// 3.filter方法
arr = arr.filter((item, index) => {
	return item != 'Mon';
});
console.log(arr);

输出结果：

特点：

1. filter遍历整个数组，用来数组的元素的条件筛选
2. 返回值同样是一个新的数组
3. filter() 不会对空数组进行处理
4. filter() 也不会改变原始数组

4.some()

let arr = ['Mon', 'Tues', 'Wed', 'Thur', 'Fri', 'Sat', 'Sun'];
// 4.some方法
let res = arr.some((item, index) => {
	console.log(index);
	return item == 'Wed';
});
console.log('判断arr中是否存在Wed元素：',res);

输出结果：

 特点：

1. some()不会遍历整个数组，它在找到第一个满足条件的，则终止循环
2. some()用来监测数组中是否有满足条件（item == 'Wed'）的元素，返回值是一个布尔值，通过输出的index，可以知道，在匹配到'Wed'后，循环终止
3. 同样some() 不会对空数组进行处理
4. some() 也不会改变原始数组

5.every()

let arr = ['Mon', 'Tues', 'Wed', 'Thur', 'Fri', 'Sat', 'Sun'];
// 5.every方法
let res = arr.every((item, index) => {
	console.log(index, item);
	return item == 'Mon';
});
console.log('判断arr中是否都是Mon元素：',res);

输出结果：

 特点：

1. every()不会遍历整个数组，一旦遍历到不满足条件的元素，则终止循环，跟some()正好相反
2. 区分：some()只要有一个元素匹配成功，终止循环，返回true，可以理解为元素的或门|| ；  every()所有的元素必须都要符合条件，否则一旦遇到匹配失败的元素，则直接终止循环，返回false，除非所有元素都符合条件，则返回true，匹配条件是元素的与门&&
3. every()用来监测数组中所有元素是否都满足条件（item == 'Mod'），返回值是一个boolean，通过输出的index，可以知道，在匹配第二次Wed时，不符合条件，则直接中止循环
4. 同样every() 不会对空数组进行处理
5. every() 也不会改变原始数组

6.find()和findIndex()

let arr = ['Mon', 'Tues', 'Wed', 'Thur', 'Fri', 'Sat', 'Sun'];
// 6.find和findIndex方法
let findRes = arr.find((item, index) => {
	console.log('find的索引值：', index);
	return item == 'Fri';
});
console.log('find返回值：', findRes);

let findIndexRes = arr.findIndex((item, index) => {
	console.log('findIndex的索引值：', index);
	eturn item == 'Fri';
});
console.log('findIndex返回值：', findIndexRes);

输出结果：

 特点：

1. find()和findIndex()不会遍历全部，找到一个匹配元素后，则终止循环，跟some()方法执行相似
2. find()返回的是符合条件的元素本身，没有符合条件的元素，则返回undefined
3. findIndex()返回的是符合条件的数组索引，没有符合条件的元素，则返回-1
4. 同样find() 和findIndex()不会对空数组进行处理
5. find() 和findIndex()也不会改变原始数组

7.reduce()和reduceRight()

最后写reduce()和reduceRight()，是他俩的特殊性，与上面几个不同的是，它的参数有四个arr.reduce(accumulator, item, index, arr)

可以简单理解为新增了一个accumulator参数，accumulator 作为上一次调用回调返回的值，或者是提供的初始值（initialValue）,是一个累加器的功能

let arr = ['Mon', 'Tues', 'Wed', 'Thur', 'Fri', 'Sat', 'Sun'];
// 6.reduce和reduceRight方法
let reduceRes = arr.reduce((item1, item2) => {
	return item1 + ',' + item2;
});
console.log(reduceRes);
let reduceRightRes = arr.reduceRight((item1, item2) => {
	return item1 + ',' + item2;
});
console.log(reduceRightRes);

输出结果：

 特点：

1. reduce()和reduceRight()遍历全部数组
2. reduce()和reduceRight()回调函数中新增一个累加参数accumulator
3. reduce()累加是从左向右，而reduceRight()是从右向左
4. 同样reduce() 和reduceRight()不会对空数组进行处理
5. reduce() 和reduceRight()也不会改变原始数组