[JavaScript] 数组迭代方法详解

1.Array.forEach()

2.Array.map()

3.Array.filter()

1.Array.forEach()

forEach() 方法为每个数组元素调用一次函数（回调函数）。

该函数接受 3 个参数：

项目值
项目索引
数组本身

特点：

这个方式是没有返回值的，只是遍历数组中的每一项，不对原来数组进行修改，但是可以自己通过数组的索引来修改原来的数组。

实例：

var numbers = [45, 4, 9, 16, 25];
numbers.forEach(function(value,index,array){
    console.log(value);
});

输出：

我们也可以循环输出index也就是数组索引值，还可以输出数组本身。如果我们用不到index和array参数那么就可以省略它们。

2.Array.map()

map() 方法通过对每个数组元素执行函数来创建新数组。
map() 方法不会对没有值的数组元素执行函数。
map() 方法不会更改原始数组。

该函数也接受三个参数：

项目值
项目索引
数组本身

当回调函数仅使用 value 参数时，可以省略索引和数组参数：

特点：

map的回调函数中支持return返回值，return的是啥，相当于把数组中的这一项变为啥（并不影响原来的数组，只是相当于把原数组克隆了一份，把克隆这一份的数组中的对应项改变了）。

实例：

var txt = [];
var numbers = [45, 4, 9, 16, 25];
txt = numbers.map(function(value,index,array){
    return value*2;
});
console.log(txt);

输出：

3.Array.filter()

filter() 方法创建一个包含通过测试的数组元素的新数组。

此函数接受 3 个参数：

项目值
项目索引
数组本身

在下面的例子中，回调函数不使用 index 和 array 参数，因此可以省略它们

特点：

如果我们需要以一定条件筛选数组里的元素并输出，那用这个方法最合适不过了，筛选条件就作为return值写在回调函数中就行

实例：（筛选出数组里大于20的元素）

var txt = [];
var numbers = [45, 4, 9, 16, 25];
txt = numbers.filter(function(value,index,array){
    return value>20;
});
console.log(txt);

输出：

4.Array.reduce()

reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。

语法：

array.reduce(function(prev, current, currentIndex, arr), initialValue)

prev：函数传进来的初始值或上一次回调的返回值
current：数组中当前处理的元素值
currentIndex：当前元素索引
arr：当前元素所属的数组本身
initialValue：传给函数的初始值

reduce的应用：

1.数组求和：

var sum = 0;
var numbers = [45, 4, 9, 16, 25];
sum = numbers.reduce(function(prev,current){
    return prev+current;
},0);
console.log(sum); //99

2.计算数组中每个元素出现的次数:

var txt = ['curry', 'james', 'green', 'curry', 'thompson'];
var names = txt.reduce(function(pre,cur){
     if(cur in pre){
         pre[cur]++
     }else{
         pre[cur] = 1 
     }
     return pre
},{})
console.log(names); //{ curry: 2, james: 1, green: 1, thompson: 1 }

3.对象里的属性求和:

var result = [
    {
        subject: 'math',
        score: 10
    },
    {
        subject: 'chinese',
        score: 20
    },
    {
        subject: 'english',
        score: 30
    }
];
 
var sum = result.reduce(function(prev, cur) {
    return cur.score + prev;
}, 0);
console.log(sum) //60

5.Array.every()

此函数接受 3 个参数：

项目值
项目索引
数组本身

如果回调函数仅使用第一个参数（值）时，可以省略其他参数

特点：

如果我们需要判断一个数组里的元素是否全部满足一个条件时，可以用every方法，如果满足则会返回true，否则返回false。

实例：

var sum;
var numbers = [45, 4, 9, 16, 25];
sum = numbers.every(function(value){
    return value>20;
});
console.log(sum); //false

6.Array.some()

这个方法同样支持上例的三个参数，它与ever方法的区别就是数组里有满足条件的元素就返回true，没有就返回false

实例：

var sum;
var numbers = [45, 4, 9, 16, 25];
sum = numbers.some(function(value){
    return value>20;
});
console.log(sum); //true

7.Array.indexOf()

indexOf() 方法在数组中搜索元素值并返回其位置（索引值）。

实例：

var result;
var numbers = [45, 4, 9, 16, 25];
result = numbers.indexOf(9)
console.log(result); //2