过滤对象数组但仅返回特定属性 - JS答案

【问题标题】：Filter array of objects but return only specific properties - JS过滤对象数组但仅返回特定属性 - JS
【发布时间】：2020-07-23 11:14:17
【问题描述】：

如何过滤带有条件的对象数组，只返回过滤后对象的特定属性？

我知道我们可以使用 filter 后跟 map 来实现这一点。但我正在寻找更简单的解决方案。

例如： let arr = [{name:"lala", id: 1}, {name: "coco", id:2}, {name: "lala", id:3}]

假设我只想要名称为“lala”的 id。

输出应该是，

[{id: 1}, {id: 3}]

【问题讨论】：

过滤和映射是完全正确的方法。如果你想避免多次迭代，你必须使用一个循环，比如 foreach。

标签： javascript arrays ecmascript-6 filter

【解决方案1】：


let arr = [
  { name: "lala", id: 1 },
  { name: "coco", id: 2 },
  { name: "lala", id: 3 },
];
let a = [];
arr.filter(({ name, id }) => {
  if (name === "lala") {
    a.push({ id });
  }
});
console.log(a);

使用过滤器，我们检查名称匹配“lala”的条件，如果是，则我们将 id 推送到新数组...这很简单

【讨论】：

请不要只发布代码作为答案，还要解释您的代码的作用以及它如何解决问题的问题。带有解释的答案通常质量更高，更有可能吸引投票。

【解决方案2】：

您可以简单地使用Array.prototype.reduce 在同一操作中结合映射和过滤。如果你想让它超级简洁，你可以在reduce回调的第二个参数中使用对象解构：

let arr = [{name:"lala", id: 1}, {name: "coco", id:2}, {name: "lala", id:3}];

let filteredMappedArr = arr.reduce((acc, { name, id }) => {
  if (name === 'lala')
    acc.push({ id });
    
  return acc;
}, []);

console.log(filteredMappedArr);

【讨论】：

【解决方案3】：

使用.filter() 和.map() 函数：

let arr = [{name:"lala", id: 1}, {name: "coco", id:2}, {name: "lala", id:3}]

let newArr = arr.filter((elm) => (elm.name === 'lala')).map( (elm) => {return {id:elm.id}});
console.log(newArr);

【讨论】：

【解决方案4】：

您可以使用Array#flatMap 并返回一个新对象或一个没有展平值的空数组。

let array = [{ name: "lala", id: 1 }, { name: "coco", id: 2 }, { name: "lala", id: 3 }],
    result = array.flatMap(({ id, name }) => name === 'lala' ? [{ id }] : []);

console.log(result);

【讨论】：

优雅的解决方案，但也比此处给出的其他方法慢得多 - 如果速度和可扩展性很重要（请参阅jsbench.me/l6k8ugcegd）

【解决方案5】：

下一个最简单的方法是减少

let arr = [{name:"lala", id: 1}, {name: "coco", id:2}, {name: "lala", id:3}];

console.log(
  arr.reduce((values, value) =>
  {
    if (value.name === 'lala') values.push({ id: value.id });
    return values;
  }, [])
);

【讨论】：

【解决方案6】：

您可以使用filter 和map 来实现；

let arr = [{name:"lala", id: 1}, {name: "coco", id:2}, {name: "lala", id:3}]
let res = arr.filter(item => item.id % 2 === 1).map(item => ({id: item.id}))

console.log(res);

【讨论】：

【解决方案7】：

filter 后跟map 可能是最易读的解决方案，但如果您希望一步完成所有操作，您可以查看经典的for 循环或使用reduce。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce

【讨论】：