一张图说明JavaScript中forEach、every、some、reduce、map、find和filter的区别

285 阅读1分钟

图片说明

实例

var persons=[
    {id:1,name:'wang1',ismale:true},
	{id:2,name:'wang2',ismale:true},
	{id:3,name:'wang3',ismale:false},
	{id:4,name:'wang4',ismale:true},
	{id:5,name:'wang5',ismale:false},
	{id:6,name:'wang6',ismale:true}
];

forEach

用途:遍历每一项

persons.forEach((v)=>{
	console.log(v.name);
});

输出:

wang1
wang2
wang3
wang4
wang5
wang6

返回:

undefined

every

用途:判断是否每项都符合条件

persons.every((item)=>{
	return item.ismale;
});

返回&输出:

false

some

用途:判断是否符合条件的项

persons.some((item)=>{
	return item.ismale==false
});

返回&输出

true

map

用途:map遍历数组,不修改原数组,返回新数组 注意: 如果要返回指定条件的项,需要在该条件下返回item,否则则返回undefined

persons.map((item)=>{
	if(item.ismale){
		return item;
    }
	return 'not male';
})

返回&输入

0: {id: 1, name: "wang1", ismale: true}
1: {id: 2, name: "wang2", ismale: true}
2: "not male"
3: {id: 4, name: "wang4", ismale: true}
4: "not male"
5: {id: 6, name: "wang6", ismale: true}

filter

用途:筛选出符合条件的项

persons.filter((item)=>{
	return item.ismale;
});

输出:

0: {id: 1, name: "wang1", ismale: true}
1: {id: 2, name: "wang2", ismale: true}
2: {id: 4, name: "wang4", ismale: true}
3: {id: 6, name: "wang6", ismale: true}

reduce

用法:

//accumulator:前一项
//currentValue:当前项值
//currentIndex:当前项索引
arr.reduce((accumulator,currentValue,currentIndex,array)=>{
    
}

示例:

[10,12,13,14,15].reduce((s,v)=>{
	return s+v;
});

结果:

64

find

除了以前的迭代器函数外,还有一个find(),它与filter类似,但只返回一次值。

persons.find((item)=>{
	return item.ismale;
});

结果:

{id: 1, name: "wang1", ismale: true}