flatMap() 是 JavaScript 中先映射后浅层展平一层的数组方法，天然支持过滤+映射+展平三合一操作：保留项返回 [value]，丢弃项返回 []，从而实现高效单次遍历处理。
flatMap() 是 JavaScript 中一个非常实用的数组方法，它把 map() 和 flat(1) 合并为一步：先对每个元素执行映射函数（返回任意长度的数组），再将所有结果数组**浅层展平一层**。正因如此，它天然适合在单次遍历中同时完成**过滤 + 映射 + 展平**三件事——关键在于让映射函数对“要保留”的项返回一个含值的数组（如 [newItem]），对“要丢弃”的项返回空数组（[]）。
用空数组实现隐式过滤
flatMap 不会跳过或忽略映射结果中的 undefined、null 或 0，但它会忠实展平你返回的数组。所以过滤逻辑应落在“返回什么数组”上：
- 想保留某项 → 返回
[mappedValue]（一个含一个元素的数组） - 想丢弃某项 → 返回
[]（空数组，展平后不产生任何元素） - 想展开多个值 → 返回
[a, b, c]（展平后依次插入）
典型场景：提取并扁平化嵌套字段
比如处理用户列表，每个用户有 tags 数组，你想获取所有不重复的标签（去重可后续做，这里先收集）：
{ name: 'Alice', tags: ['js', 'react'] },
{ name: 'Bob', tags: ['css', 'html'] },
{ name: 'Charlie', tags: [] }
];
const allTags = users.flatMap(user => user.tags);
// → ['js', 'react', 'css', 'html']
这里没有显式过滤，但 Charlie 的空 tags 自动被“过滤掉”，因为 [] 展平后无元素。
组合过滤与映射：只取偶数的平方
给定数字数组，要求：过滤出偶数，再计算其平方，最后扁平结果（虽然本例无需展平多层，但逻辑清晰）：
const nums = [1, 2, 3, 4, 5];const squaresOfEvens = nums.flatMap(n => n % 2 === 0 ? [n * n] : []);
// → [4, 16]
对比传统写法：nums.filter(n => n % 2 === 0).map(n => n * n) —— 需两次遍历；而 flatMap 一次搞定，且语义紧凑。
处理可能为 null/undefined 的嵌套结构
当数据结构不健壮时，可在映射函数中安全解构并条件返回：
const data = [{ profile: { avatar: 'a1.jpg' } },
{ profile: null },
{ profile: { avatar: 'a2.jpg' } }
];
const avatars = data.flatMap(item =>
item.profile?.avatar ? [item.profile.avatar] : []
);
// → ['a1.jpg', 'a2.jpg']
既避免了 Cannot read property 'avatar' of null，又跳过了无效项，全程一次循环。
