首页 > 解决方案 > 带有动态键的 TypeScript array.map()

问题描述

我有一个Foo被调用的数组fooArray,但我希望map()该数组只包含在arrayOfKeys.

class Foo {
  id: number;
  name: string;
  age: number;

  constructor(id: number, name: string, age: number) {
    this.id = id;
    this.name = name;
    this.age = age;
  }
}

let fooArray: Foo[] = [
  new Foo(1, 'Foo', 20), 
  new Foo(2, 'Bar', 21),
  new Foo(3, 'MyFoo', 20)
  ];


//The keys I would like to select from Foo.
const arrayOfKeys: (keyof Foo)[] = ['name', 'age'];  

我不知道该怎么做才能得到下面的预期结果:

// The result is a copy of 'fooArray', but the objects only 
// contain the keys (and their values) defined in 'arrayOfKeys'.
[
   { name: 'Foo', age: 20 },
   { name: 'Bar', age: 21 },
   { name: 'MyFoo', age: 20 }
]

标签: javascripttypescript

解决方案


您可以通过在地图中创建一个新对象并返回它来做到这一点?

就像是

const fooArrayWithLimitedKeys = fooArray.map(item => arrayOfKeys.reduce(
  (accumulator, key) => {
    accumulator[key] = item[key]
    return accumulator
  }, {})
)

也可以不写reduce如下:

const fooArrayWithLimitedKeys = fooArray.map(item => {
  const returnValue = {}
  arrayOfKeys.forEach(key => {
    returnValue[key] = item[key]
  })
  return returnValue;
})

推荐阅读