如何通过深度嵌套的对象数组进行映射？

Question

const my_arr = [
   {id: 1, arr: [{subId: 1, value: 1}],
   {id: 2, arr: [{subId: 2, value: 2}],
   {id: 3, arr: [{subId: 3, value: 1}],
]

如何映射此数组 my_arr，然后将 arr 映射到 return 数组，如下所示：

[
  {subId: 1, value: 1},
  {subId: 3, value: 1},
]

基本上只过滤掉值为 1 的地方，然后 return 只过滤那个子对象

我试过

my_arr.map((x) => x.map((y) => y.value === 1 ? y : null))

Answer 1

您可以通过 flatMap and filter

尝试这种方法

const my_arr = [
   {id: 1, arr: [{subId: 1, value: 1}]},
   {id: 2, arr: [{subId: 2, value: 2}]},
   {id: 3, arr: [{subId: 3, value: 1}]},
]

const result = my_arr.flatMap(item => item.arr).filter(item => item.value === 1)

console.log(result)

Answer 2

您当前的方法映射到外部数组 my_arr，然后使用内部映射映射到内部数组。由于 .map() always returns an array, you'll end up mapping your objects from your outer array to other arrays, which you don't want. You can instead use .flatMap() which will combine/join the returned inner arrays into one array. However, rather than using .map() as your inner method though, you should use .filter() 创建了一个 value 为 1 的对象数组，然后将其合并到由 .flatMap() 方法创建的结果外部数组中：

const my_arr = [ {id: 1, arr: [{subId: 1, value: 1}]}, {id: 2, arr: [{subId: 2, value: 2}]}, {id: 3, arr: [{subId: 3, value: 1}]}, ];

const res = my_arr.flatMap(({arr}) => arr.filter(({value}) => value === 1));
console.log(res);

Answer 3

由于您正在处理嵌套结构，因此您将不得不发挥一点创意。

首先你必须过滤数组。
在里面，你可以用.some检查你的条件是否匹配，return匹配
现在您有了过滤后的列表，但您仍然需要格式化输出。您可以对每个项目使用 .reduce 和 concat arr

如果您在 arr 中有多个项目，这将很有用。

const my_arr = [
   {id: 1, arr: [{subId: 1, value: 1}] },
   {id: 2, arr: [{subId: 2, value: 2}] },
   {id: 3, arr: [{subId: 3, value: 1}] },
]

const output = my_arr
  .filter(({ arr }) =>
    arr.some(({value}) => value === 1)
  ).reduce((acc, { arr }) => acc.concat(arr), [])
  
console.log(output)

如何通过深度嵌套的对象数组进行映射？

How to map through a deeply nested array of objects?

javascript

arrays

filtering