过滤对象数组返回空数组答案

【问题标题】：Filter an array of objects returns empty array过滤对象数组返回空数组
【发布时间】：2018-05-10 23:40:39
【问题描述】：

我有以下对象数组：

arr = [
    {
        name: "john",
        age: 24,
        gender: "male"
    },
    {
        name: "jane",
        age: 27,
        gender: "female"
    },
    {
        name: "joe",
        age: 29,
        gender: "male"
    }
]

我正在尝试将name 和age 属性过滤到一个新数组中。我试过这个：

const newFields = arr.filter((item) => {
    return (
        item.name && item.age
    );
});

但由于某种原因，newFields 返回一个空数组。

【问题讨论】：

将filter更改为map并返回{name: item.name, age:item.age}
它工作得非常好。也许在数组过滤和数组定义之间你改变了数组并且数组已经是空的？
filter 使用它从数组中删除条目。 map 使用它来转换数组中的条目。你想要后者。

标签： javascript arrays object filter

【解决方案1】：

用.map()代替.filter()

const arr = [
  {
    name: "john",
    age: 24,
    gender: "male"
  },
  {
    name: "jane",
    age: 27,
    gender: "female"
  },
  {
    name: "joe",
    age: 29,
    gender: "male"
  }
];

const newFields = arr.map(item => {
  return {
      name: item.name,
      age: item.age
    }
});
console.log(newFields)

【讨论】：

【解决方案2】：

这也可以是带有箭头功能和Parameter Context Matching 的单线

const newFields = arr.map(({ name, age }) => ({ name, age }));

您的解决方案的结果不能为空，而是原始数组，因为在这种情况下，您的 filter 函数的返回值将始终为真（每个项目都有 name 和 age 属性），它不会从原arr变量。

【讨论】：

【解决方案3】：

如果您要使用原始数组的子集创建新数组 - 那么您可以遍历数组并将所需元素推送到其自己的数组中。

也就是说，如果您想要获取的只是现有数组的名称和年龄 - 为什么需要创建一个单独的数组？ - 您可以遍历原始数组并仅引用每个项目的所需值。

let arr = [
    {
        name: "john",
        age: 24,
        gender: "male"
    },
    {
        name: "jane",
        age: 27,
        gender: "female"
    },
    {
        name: "joe",
        age: 29,
        gender: "male"
    }
]

let newArr = [];

arr.forEach(function(item) {
    newArr.push({name:item.name, age:item.age})
});

console.log(newArr); // gives [{"name": "john","age": 24},{"name": "jane","age": 27},{"name": "joe","age": 29}]

【讨论】：

谢谢。只是想知道在性能方面，forEach 与 map 相比有多好？