如何获取数组中对象的子集，将数组作为参数传递答案

【问题标题】：How to get a subset of objects in an array passing an array as an argument如何获取数组中对象的子集，将数组作为参数传递
【发布时间】：2020-03-21 17:35:40
【问题描述】：

我正在从 API 调用接收一组对象作为响应数据。

data = [{obj1},{obj2},{obj3},{obj4},{obj5}]

obj1 = {
  prop1: 'value1',
  prop2: 'value2',
  prop3: 'value3',
}

我正在尝试使用数组，比如说：['prop2', 'prop3'] 来过滤对象数组并返回对象子集的数组。

[{filteredObj1},{filteredObj2},{filteredObj3},{filteredObj4},{filteredObj5}]

filteredObj1 = {
  prop2: 'value2',
  prop3: 'value3'
}

等等……

最初尝试过以下方法：

const arrayOfPropsIWant = ['prop1', 'prop2']

data.forEach((el) => {
  const filtered = (({ ...arrayOfPropsIWant }) => ({ ...arrayOfPropsIWant }))(el);
})

当我没有传递 ...arrayOfPropsIWant 来解构我显式传递道具 (({ prop1, prop2 })

我正在尝试构建一个自定义 ReactJS 钩子，有什么方法可以实现吗？

【问题讨论】：

标签： javascript reactjs

【解决方案1】：

你应该使用 Array.map：

const data = [
 { prop1: 'value1', prop2: 'value2', prop3: 'value3' },
 { prop1: 'value1', prop2: 'value2', prop3: 'value3'},
 { prop1: 'value1', prop2: 'value2', prop3: 'value3'}
]

const arrayOfPropsIWant = ['prop1', 'prop2']

const filtered = data.map((elem) => {
    const out = {};
    arrayOfPropsIWant.forEach(prop => out[prop] = elem[prop]);
    return out;
   }
);

console.log(filtered);

【讨论】：

【解决方案2】：

试试map

const data = [
 { prop1: 'value1', prop2: 'value2', prop3: 'value3' },
 { prop1: 'value1', prop2: 'value2', prop3: 'value3'},
 { prop1: 'value1', prop2: 'value2', prop3: 'value3'}
]

const result = data.map(({prop2, prop3})=>({prop2, prop3}))

console.log(result);

【讨论】：

在该示例中，您不能使用字符串数组编辑道具名称

【解决方案3】：

试试这个，

const data = [
 { prop1: 'value1', prop2: 'value2', prop3: 'value3' },
 { prop1: 'value1', prop2: 'value2', prop3: 'value3'},
 { prop1: 'value1', prop2: 'value2', prop3: 'value3'}
];

const props=['prop1','prop2']

const result = data.map((item)=>{
  Object.keys(item).map((key)=>{
    if(!props.includes(key))
      delete item[key];
  })
  return item;
})

console.log(result);

【讨论】：

delete完全删除object属性，以后需要怎么办？您应该先复制该对象。

【解决方案4】：

你可以试试这个：

const data = [
  { name: 'aaa', age: 10, id: 1 },
  { name: 'aab', age: 20, id: 2 },
];

const map = array => keys =>
  array.map(
    /** you should use 
    Object.fromEntries(
      Object.entries(item).filter(([key])=>keys.includes(key))
    )
    but beause Stack Overflow has not updated babel since years
    this will not work on SO code snippet
    **/
    item =>
      keys.reduce((result, key) => {
        result[key] = item[key];
        return result;
      }, {})
  );
const mapData = map(data);
console.log('id and name', mapData(['id', 'name']));
console.log('id and age', mapData(['id', 'age']));

【讨论】：