数组高级技法之flatMap

53 阅读1分钟

我们知道数组的filter方法和map方法是会产生中间数组的,这在开发中往往会增加代码量。接下来我举一个例子

const numArr = [1,2,3,4,5,6,7,8,9,10]
​
const res = numArr.filter(item => item % 2 !== 0).map(item => item * item)
​
console.log(res)   //  [1,9,25,49,81]

image.png 如上图所示,filter和map 所花费的时间是4.209 ms


然后我们换上我们的flatMap方法

console.time('filterAndMap');
​
const numArr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
​
// const res = numArr.filter((item) => item % 2 !== 0).map((item) => item * item);
const res = numArr.flatMap((item) => (item % 2 !== 0 ? [item * item] : []));
​
console.log(res); //  [1,9,25,49,81]
​
console.timeEnd('filterAndMap');

下面是执行结果,很明显,flatMap所花费的时间远小于上面的4.209 ms

image.png