使用带有条件javascript的地图从数组中提取id答案

【问题标题】：extract id from array using map with condition javascript使用带有条件javascript的地图从数组中提取id
【发布时间】：2020-03-12 11:19:35
【问题描述】：

有一个对象数组

  const groups = [
    { id: 0, name: "All", selected: false },
    { id: -1, name: "All", selected: true },
    { id: 1, name: "Group1", selected: false },
    { id: 2, name: "Group2", selected: false },
    { id: 3, name: "Group3", selected: false },
    { id: 4, name: "Group4", selected: true }
  ];

我想用地图从这个对象中提取 id

groups.map(group => group.id > 0 && group.selected ? group.id:null)

但结果将是 [null,null,4,null...] 其实应该是[4]

我知道我可以使用 forEach 和 push 或 map 和 filter 等其他功能，但我会解决使用地图或其他东西进行一次迭代。

【问题讨论】：

map() 方法创建一个新数组，其中填充了对调用数组中的每个元素 调用提供的函数的结果。这就是为什么那些不满足条件的字段为空。而是使用 filter
@brk 你的意思是没有办法避免在地图中返回值？
"我想把这颗钉子钉在墙上。我知道我可以用锤子，但我想用我的鞋子"。你看到问题了吗？您为这项工作使用了错误的工具。为什么你认为你需要专门使用map？根据以下答案之一，您应该使用 filter 和 map 的组合。

标签： javascript ecmascript-6

【解决方案1】：

根据您的条件过滤对象，然后使用地图提取 id/s

const groups = [{
    id: 0,
    name: "All",
    selected: false
  },
  {
    id: -1,
    name: "All",
    selected: true
  },
  {
    id: 1,
    name: "Group1",
    selected: false
  },
  {
    id: 2,
    name: "Group2",
    selected: false
  },
  {
    id: 3,
    name: "Group3",
    selected: false
  },
  {
    id: 4,
    name: "Group4",
    selected: true
  }
];


const result = groups.filter(x => x.id > 0 && x.selected).map(x => x.id)
console.log(result)

【讨论】：

感谢@eugen-sunic，有什么办法可以避免在地图中返回值。
map的重点是返回一些东西给你的数组，你到底想要什么？
我想要什么以及我问这个问题的原因是找到一种方法，在 map 函数的某些条件下不返回任何内容或返回无效值。
@HamidShoja 无论如何，如果您的问题是使用过滤器并通过地图实现此目的，那么这是不可能的，也不应该这样做..您应该先过滤然后提取，否则您需要其他东西
好的，谢谢，所以 map 函数总是返回一个值，这是不可避免的。

【解决方案2】：

在这种情况下，您可以使用传感器，这样您就不会遍历数组 2 次。

const groups = [
  { id: 0, name: "All", selected: false },
  { id: -1, name: "All", selected: true },
  { id: 1, name: "Group1", selected: false },
  { id: 2, name: "Group2", selected: false },
  { id: 3, name: "Group3", selected: false },
  { id: 4, name: "Group4", selected: true }
];

const filteredIds = groups.reduce(
  (ids, { id, selected }) => (
    id > 0 && selected ? [...ids, id] : ids
  ), []
);

console.log(filteredIds);

【讨论】：

您的解决方案当然具有换能器解决方案的性能优势，但并不完全相同。

【解决方案3】：

map() 方法使用为每个数组元素调用函数的结果创建一个新数组，并且无法通过此方法进行提取。要么使用 map()，然后丢弃数组项，要么使用 filter()。

更好的方法是使用 filter()。 filter() 方法创建一个数组，其中填充了所有通过测试的数组元素（作为函数提供）。

let result = groups.filter(x => x.id > 0 && x.selected).map(x => x.id)

【讨论】：

【解决方案4】：

您可以使用传感器在一次迭代中轻松完成此操作。

const getPositiveSelectedIDs = pipe([
  filter(and([
    gt(get('id'), 0),
    get('selected'),
  ])),
  map(get('id')),
])

transform(getPositiveSelectedIDs, [])(groups) // => [4]

在此示例中，getPositiveSelectedIDs 是我们使用函数 pipe、map 和 filter 声明的转换器。传递给filter 的谓词使用函数and、gt 和get 来表示

只让具有正 id 且已被选中的组通过

然后，在不创建任何中间数组的情况下，我们使用map 和get 获得每个组的ID。当我们在transform 中使用getPositiveSelectedIDs 时，它就像一个转换器。当我们用groups 调用转换transform(getPositiveSelectedIDs, []) 时，数据流就开始了。