javascript - array.map() 不返回单个数组

Question

我有下面的代码，我希望从嵌套数组映射结果并返回一个具有两个 id 的数组，但我得到了 2 个数组。有人可以指导我做错了什么吗？

arrayVal = [{
    sources: {
      data: [{
        id: 1
      }]
    }
  },
  {
    sources: {
      data: [{
        id: 2
      }]
    }
  }
]

for (let sub of arrayVal) {
  let result = sub.sources.data.map(x => (x.id))
  console.log(result)
}

Answer 1

现在，您正在调用map中的每个元素arrayVal，因此您得到了两个数组。而是使用reduce将对象数组转换为另一个数组，该数组不一定与输入元素一对一：

const arrayVal=[{sources:{data:[{id:1}]}},{sources:{data:[{id:2}]}}];

const result = arrayVal.reduce((a, { sources: { data } }) => (
  [...a, ...data.map(({ id }) => id)]
), []);
console.log(result)

Answer 2

尝试关注

var arrayVal = [{sources: {data: [{id: 1}]}},{sources: {data: [{id: 2}]}}];

// Create an array on sources.data and merge it into 1 collection (array)
var result = arrayVal.reduce((a, c) => [...a, ...c.sources.data.map(({id}) => id)], []);

console.log(result);

供参考，Array.reduce

此外，您可以按如下方式改进您的代码

var arrayVal = [{sources: {data: [{id: 1}]}},{sources: {data: [{id: 2}]}}];

let result = [];
for (let sub of arrayVal) {
  result.push(sub.sources.data.map(x => (x.id)));
}
console.log([].concat(...result))

Answer 3

arrayVal = [{
    sources: {
      data: [{
        id: 1
      }]
    }
  },
  {
    sources: {
      data: [{
        id: 2
      }]
    }
  }
]

let result = [];
for (let sub of arrayVal) {
  result = result.concat(sub.sources.data.map(x => (x.id)))

}

console.log(result)

我认为concat这是您在这里所缺少的，希望这是您想要实现的目标

Answer 4

尝试这个

arrayVal = [{
    sources: {
      data: [{
        id: 1
      }]
    }
  },
  {
    sources: {
      data: [{
        id: 2
      }]
    }
  }
]

let result = arrayVal.map((x) => x.sources.data[0].id)
console.log(result)

Answer 5

你可以这样做：

arrayVal = [{
    sources: {
      data: [{
        id: 1
      }]
    }
  },
  {
    sources: {
      data: [{
        id: 2
      }]
    }
  }
]

var flat = arrayVal.reduce(function(prev,curr,cI){
  prev.push(curr.sources.data.map(x => (x.id))[0]);
  return prev; // *********  Important ******
}, []);