1、forEach
该方法等同于for循环,没有返回值
const arr=[1,2,3,4,5,6]
arr.forEach((item,index,arr)=>{
//item 数组中每一项
//index item每一项对应的下坐标
// arr 调用该方法的数组本身
})
2、map
映射,该方法使用和forEach大致相同,但是该方法有返回值,返回一个新数组,新数组的长度和原数组长度相等
//item: 数组中的每一项;
//index:item 对应的下标索引值
//arr: 就是调用该方法的数组本身
arr.map((item,index,arr)=>{
return item * 2
})
//2,4,6,8,10,12
3、filter
有返回值,过滤出来符合条件的元素
const res=arr.filter((item,index,arr)=>{
return item % 2 === 0
})
// 2 4 6
过滤出布尔类型为true的项
const arr1=[0,"",false,1,2]
const res1=arr.filter((item,index,arr)=>{
return item
})
//[1,2]
4、some
判断数组中有没有符合条件的项(只要有一个,就返回true),如果一个都没有,才返回false
const arr2=[
{
name:'xm',age:20,done:true
},
{
name:'xf',age:18,done:true
},
{
name:'wl',age:19,done:false
},
]
const res3=arr2.some(item=>{
return item.done
})
//true
5、every
判断数组中所有的项是否满足要求,如果全都满足,才返回true,否则返回false
const res4=arr2.every(item=>{
return item.done
})
//false
6、find
找到符合条件的项,并且返回第一项
const res5=arr2.find(item=>{
return item.done
})
//{name: 'xm', age: 20, done: true}
7、findIndex
找到符合条件的项的下标,并且返回第一项的下标值
const res6=arr2.findIndex(item=>{
return item.done
})
//0
8、reduce
(1)求和计算
*第一次:pre–>1 next–>2 index–>1
pre+next=1+2=3
*第二次:pre–>3 next–>3 index–>2
pre+next=3+3=6
*第三次:pre–>6 next–>4 index–>3
pre+next=6+4=10
*第四次:pre–>10 next–>5 index–>4
pre+next=10+5=15
const arrList=[1,2,3,4,5]
const res7=arrList.reduce((pre,next,arr)=>{
return pre+next
})
//15
(2)数组扁平化(拼接数组)
const arr3=[[1,2,3],[4,5],[6,7,8]]
const res8=arr3.reduce((pre,next,index)=>{
return pre.concat(next)
})
// [1, 2, 3, 4, 5, 6, 7, 8]
(3)对象属性叠加计算
const arr4=[
{
price:10,
count:5
},
{
price:20,
count:2
},
{
price:30,
count:3
}
]
const res9=arr4.reduce((pre,next)=>{
return pre+next.price*next.count
},0)
//180
(4)计算数组中每个元素出现的次数
const names=['Alice','Bob','Joie','Bruce','Alice']
const countNames=names.reduce((allName,name)=>{
if(name in allName){
allName[name]++
}else{
allName[name]=1
}
return allName;
},{})
//{Alice: 2, Bob: 1, Joie: 1, Bruce: 1}