js的map、flatMap和find、filter的使用详解
作者：qq_49077729
map和flatMap都是返回一个新数组,map不会改变数组长度,flatMap可以改变长度,find和filter都是过滤操作,find只会返回第一个找到的值,而filter会返回全部符合要求的对象
js的map、flatMap和find、filter的使用
map和flatMap 都是返回一个新数组，map不会改变数组长度，flatMap可以改变长度
就是在数组上加工变成一个新的数组，切不会改变数组长度，不满足条件的返回undefined
map使用和flatMap是一样的
结果也是一样
let arr = [1, 2, 3, 4, 5, 6];
let res = arr.map((e) => {
if (e % 2 == 0) {
return e;
}
});
console.log("res===[undefined, 2, undefined, 4, undefined, 6]",res);
let res2 = arr.map((e) => {
return e * 2
});
console.log("res2===[2, 4, 6, 8, 10, 12]",res2);
//简介方式
let res3 = arr.map((e) => e * 2);
console.log("res3===[2, 4, 6, 8, 10, 12]",res3)flatMap会将结果数组扁平化一层
就是返回的结果是一个数组，就会将数组去掉后返回，假如返回的不是数组，会变成数组在扁平化一层在返回
let arr = [1, 2, 3, 4, 5, 6];
let res = arr.flatMap((e) => {
if (e % 2 == 0) {
return e;
}
});
console.log("res===[undefined, 2, undefined, 4, undefined, 6]");
let res2 = arr.flatMap((e) => {
return e * 2
});
console.log("res2===[2, 4, 6, 8, 10, 12]");
let res3 = arr.flatMap((e) => {
return [e,e * 2]
}
);
console.log("res3=== [1, 2, 2, 4, 3, 6, 4, 8, 5, 10, 6, 12]",res3)find 、filter 都是过滤操作
找到符合要求的对象返回，区别在于find只会返回第一个找到的值，而filter会返回全部符合要求的对象
let res4 = arr.find((e) => {
return e % 2 === 0
})
console.log("res4=== [2]",res4)
let res5 = arr.filter((e) => {
return e % 2 === 0
})
console.log("res5=== [2,4,6]",res5)总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。