类似map的过滤方法

之前想要快速改变一个数组对象值的时候，你可能想到map方法

const numbers = [1, 2, 3, 4, 5];

const doubledNumbers = numbers.map(num => num * 2);

console.log(doubledNumbers); // 输出 [2, 4, 6, 8, 10]

但是我想要某些值不想要进行过滤掉，并且进行修改，就会用到reduce

const numbers = [1, 2, 3, 4, 5];
const filteredAndFlattenedArray = numbers.reduce((acc, num) => {
  if (num % 2 === 0) {
    acc.push(num); // 仅保留偶数
  }
  return acc;
}, []);

console.log(filteredAndFlattenedArray); // 输出 [2, 4]

写法很不直观，偶尔翻到ECMAScript 2019（ES10）文档看到有个flatMap()方法，觉得这个方法还是可以的，写法跟map方法一样

const arrays = [[1, 2], [], [3, 4], [], [5]];
const flattenedArray = arrays.flatMap(curr => curr);

console.log(flattenedArray); // 输出 [1, 2, 3, 4, 5]

在上述示例中，我们使用 flatMap() 方法对数组 arrays 进行映射操作。
在映射函数 curr => curr 中，我们返回每个元素本身。
对于空数组，我们返回了一个空数组 []。
由于 flatMap() 方法会忽略空数组，所以空数组不会在最终结果中出现。
所以上面用reduce方法可以改成更为简洁的方法

const numbers = [1, 2, 3, 4, 5];
const filteredAndFlattenedArray = numbers.flatMap((e, i) => {
  if (e % 2 === 0) {
   return e
  }
  return [];
});
console.log(filteredAndFlattenedArray) // 输出 [2, 4]