【无标题】

本文详细介绍了JavaScript中的八种数组方法:forEach、includes、filter、map、find、findIndex、some和every,以及reduce的不同用途,如数组求和、转换、计数和数据处理。
摘要由CSDN通过智能技术生成

一、forEach

回调函数参数,item(数组元素)、index(序列)、arr(数组本身)
循环数组,无返回值,不改变原数组
不支持return操作输出,return只用于控制循环是否跳出当前循环

二、includes

判断数组是否包含某个元素,不用return,不用回调函数,返回布尔值

三、filter

使用return操作输出,会循环数组每一项,并在回调函数中操作
返回满足条件的元素组成的数组,不改变原数组

四、map

输出的是return什么就输出什么新数组
原数组被“映射”成对应新数组,返回新数组,不改变原数组

五、find

用来查找目标元素,找到就返回该元素,找不到返回undefined
输出的是一旦判断为true则跳出循环输出符合条件的数组元素

六、findIndex

数组实例的findIndex方法的用法与find方法非常类似,返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1

七、some

some()是对数组中每一项运行给定函数,如果该函数对任一项返回true,则返回true
some一直在找符合条件的值,一旦找到,则不会继续迭代下去
返回布尔值,遇到满足条件变跳出循环

八、every

every()是对数组中每一项运行给定函数,如果该函数对每一项返回true,则返回true
every从迭代开始,一旦有一个不符合条件,则不会继续迭代下去。 every() 不会对空数组进行检测
返回布尔值,遇到不满足条件跳出循环

九、reduce

累加器,输出的是return叠加什么就输出什么
回调函数参数四个
pre: 初始值(之后为上一操作的结果)
cur: 当前元素之
index: 当前索引
arr: 数组本身
主要有以下几种用法

1.数组求和

[1,2,3,4].reduce((pre, cur) => pre + cur)//10

2.二维数组转为一维数组

[[1, 2], [3, 4], [5, 6]].reduce(( acc, cur ) => […acc, …cur], [])//[1, 2, 3, 4, 5, 6]

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

const arraySum = (arr, val) => arr.reduce((acc, cur) => {
return cur == val ? acc + 1 : acc + 0
}, 0);
let arr = [1, 2, 3, 4, 5];
arraySum(arr, 0) 

4.代替filter和map的组合

const characters = [
{ name: 'ironman', env: 'marvel' },
{ name: 'black_widow', env: 'marvel' },
{ name: 'wonder_woman', env: 'dc_comics' },
];
console.log(
characters
.filter(character => character.env === 'marvel')
.map(character => Object.assign({}, character, { alsoSeenIn: ['Avengers'] }))
);
// [
// { name: 'ironman', env: 'marvel', alsoSeenIn: ['Avengers'] },
// { name: 'black_widow', env: 'marvel', alsoSeenIn: ['Avengers'] }
// ]

console.log(
characters
.reduce((acc, character) => {
return character.env === 'marvel'
? acc.concat(Object.assign({}, character, { alsoSeenIn: ['Avengers'] }))
: acc;
}, [])
)
// [
// { name: 'ironman', env: 'marvel', alsoSeenIn: ['Avengers'] },
// { name: 'black_widow', env: 'marvel', alsoSeenIn: ['Avengers'] }
// ]
  • 7
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值