[JavaScript] 数组迭代方法详解

输出：

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

2.Array.map()

1. map() 方法通过对每个数组元素执行函数来创建新数组。

2. map() 方法不会对没有值的数组元素执行函数。

3. 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)

1. prev：函数传进来的初始值或上一次回调的返回值

2. current：数组中当前处理的元素值

3. currentIndex：当前元素索引

4. arr：当前元素所属的数组本身

5. 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 个参数：

• 项目值

• 项目索引

• 数组本身

最后

自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数初中级Android工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。

因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！不论你是刚入门Android开发的新手，还是希望在技术上不断提升的资深开发者，这些资料都将为你打开新的学习之门！

如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！
mg-30eRemLq-1715718136821)]

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！不论你是刚入门Android开发的新手，还是希望在技术上不断提升的资深开发者，这些资料都将为你打开新的学习之门！

如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！