Question

我试图压扁数组的对象数组。例如，我们可能会这样：

[{ numbers: [1, 2, 3] }, { numbers: [4, 5] }, { numbers: [6] }]

我想把它压成：

[1, 2, 3, 4, 5, 6]

我有一个有效的解决方案：

＆＃13;

const arr = [{ numbers: [1, 2, 3] }, { numbers: [4, 5] }, { numbers: [6] }];
const almostFlattened = arr.map((obj) => obj.numbers);
const flattened = [].concat.apply([], almostFlattened);
console.log(flattened);

＆＃13;

有没有人知道这里有一个更简单或更高效的解决方案，最好没有almostFlattened中间步骤？

Answer 1

您可以尝试Array.reduce()，并通过将数字与累加器连接来展平数字的数组：

const arr = [{ numbers: [1, 2, 3] }, { numbers: [4, 5] }, { numbers: [6] }];

const result = arr.reduce((r, obj) => r.concat(obj.numbers), []);

console.log(result);

另一个选项是Array.flatMap()（IE / Edge不支持）：

const arr = [{ numbers: [1, 2, 3] }, { numbers: [4, 5] }, { numbers: [6] }];

const result = arr.flatMap(obj => obj.numbers);

console.log(result);

Answer 2

为什么不使用你拥有的东西，但是内联？当您可以将almostFlattened调用作为.map参数的一部分时，无需声明中间变量.concat：

const arr = [{ numbers: [1, 2, 3] }, { numbers: [4, 5] }, { numbers: [6] }]
const result = [].concat(...arr.map(o => o.numbers));
console.log(result)

Answer 3

将展开语法与reduce：

一起使用

＆＃13;

const input = [{ numbers: [1, 2, 3] }, { numbers: [4, 5] }, { numbers: [6] }]
const output = input.reduce(((outputSoFar, { numbers }) => [...outputSoFar, ...numbers]), []);
console.log(output);

＆＃13;

Answer 4

我还认为如果有人使用像lodash / underscore这样的东西（我不知道在发布问题时存在这个功能），我会抛弃它：

const arr = [{ numbers: [1, 2, 3] }, { numbers: [4, 5] }, { numbers: [6] }];
const flattened = _.flatten(arr, 'numbers');
console.log(flattened);

<script src="https://cdn.jsdelivr.net/npm/lodash@2.4.2/lodash.js"></script>

Answer 5

平面地图很棒

const data = [{ numbers: [1, 2, 3] }, { numbers: [4, 5] }, { numbers: [6] }]

data.flatMap(n => n.numbers)

如果你想用数组扁平化对象：

Object.values({one: [1,2,3], two: [4,5,6]}).flat()

展平数组JavaScript对象的数组

5 个答案: