Question

我有一个疯狂的数组，像这样：

YOUR_API_KEY_HERE

我想将const data = [ [{ Name: 'Name 1', Block: [{Id: "1"}, {Id: "2"}] }], [{ Name: 'Name 2', Block: [{Id: "3"}, {Id: "4"}] }], ]映射到单个数组，如下所示：

Block

我试图这样做：

[  { Id: '1' },
   { Id: '2' },
   { Id: '3' }, 
   { Id: '4' }
]

我做错了什么？

Answer 1

.map将为旧数组的每个索引创建一个新项目。如果您的输入数组有2个项目，则输出数组也将只有2个项目-但您需要4个项目，因此.map将不起作用。请改用flatMap进行展平：

const data = [
     [{ Name: 'Name 1', Block: [{Id: "1"}, {Id: "2"}] }],
     [{ Name: 'Name 2', Block: [{Id: "3"}, {Id: "4"}] }],
];

const idList = data.flatMap(([{ Block }]) => Block);

console.log(idList)

flatMap仅在较新的实现中实现-否则，请使用polyfill或其他方法，例如将reduce插入数组：

const data = [
     [{ Name: 'Name 1', Block: [{Id: "1"}, {Id: "2"}] }],
     [{ Name: 'Name 2', Block: [{Id: "3"}, {Id: "4"}] }],
];

const idList = data.reduce((a, [{ Block }]) => a.concat(Block), []);

console.log(idList)

Answer 2

您的数据是数组中的一个数组，因此您应该使用map两次，但是Buth将为您提供一个包含2个元素的数组，现在您需要缩小或展平所得的数组以获得所需的输出。

data.map(a=>{return a[0].Block.map(b=>{ return b})}).reduce((o, m) => [...m, ...o], [])

Answer 3

最简洁的方法是使用reduce语句：

const reducer = (a, b) => a.concat(b[0].Block);
const idList = data.reduce(reducer, []);

这样，您要做的事情就会更加清楚。

映射数组数组？

3 个答案: