JavaScript 数组之flat和flatMap
在 JavaScript 中，flat() 和 flatMap() 都是数组的方法，它们可以用来处理嵌套数组，但它们的功能有所不同。
1、flat
用途
flat() 方法用于创建一个新数组，该新数组将原始数组中的所有子数组连接到指定深度的层级。这对于简化多维数组非常有用。
array.flat([depth])array: 要展平的原始数组。
depth (可选): 指定展平的最大深度。默认值为 1onst arr = [1, 2, [3, 4, [5, 6]], 7];
const flattened = arr.flat(2); // 展平两层
console.log(flattened); // 输出: [1, 2, 3, 4, [5, 6], 7]const fullyFlattened = arr.flat(Infinity); // 完全展平
console.log(fullyFlattened); // 输出: [1, 2, 3, 4, 5, 6, 7]使用场景
- 当你需要将多维数组简化为单个一维数组时。
- 当你需要处理嵌套的数据结构，例如 JSON 数据，并希望简化数据访问
2. flatMap()
用途
flatMap() 方法首先映射然后展平数组。它允许你对每个元素应用一个转换函数，然后将结果展平到一层。这使得它非常适合于在转换数组的同时保持数据的一致性。
示例
array.flatMap(callback[, thisArg])callback: 一个回调函数，它为每个元素调用并返回新的元素。
thisArg (可选): 执行回调时使用的 this 值。const numbers = [1, 2, 3];
const doubledAndFlattened = numbers.flatMap(x => [x * 2]);
console.log(doubledAndFlattened); // 输出: [2, 4, 6]const nestedNumbers = [1, [2, 3], 4];
const flattened = nestedNumbers.flatMap(x => Array.isArray(x) ? x : [x]);
console.log(flattened); // 输出: [1, 2, 3, 4]比如我有一个数组 name 以顿号分割和 count也以对号分割 两条变成6条
let arr = [{ name: "张三、李四", num: 10000, count: "上天、入地" },{ name: "王五", num: 20000, count: "下海、游泳" },];结果[{ name: "张三", num: 10000, count: "上天" },{ name: "张三", num: 10000, count: "入地" },{ name: "李四", num: 10000, count: "上天" },{ name: "李四", num: 10000, count: "入地" },{ name: "王五", num: 20000, count: "下海" },{ name: "王五", num: 20000, count: "游泳" }
]// 分割名称和计数字段let splitData = arr.flatMap((item) => {let names = item.name.split("、");let counts = item.count.split("、");return counts.flatMap((count) => {return names.map((name) => ({name,num: item.num,count,}));});});console.log(splitData);