在ES6中简单解构阵列/对象

时间:2017-09-05 21:43:30

标签: javascript ecmascript-6 destructuring

我正在尝试使用选定的键返回新对象 - reqProps 。我设法用修复道具 prop1,prop3 来做,现在希望能够传递reqProps数组值来替换prop1,prop3。我尝试过函数,字符串文字和很少的黑客'。他们都没有工作

const data = [
  {
    prop1: 1,
    prop2: 2,
    prop3: 3
  },
  {
    prop1: 10,
    prop2: 20,
    prop3: 30
  },
  {
    prop2: 200,
    prop4: 400
  },
  {
    prop3: 3000
  }
];

// to return properties for the following...
const reqProps = ['prop2','prop3','prop4'];

// current implementation fixing return object with prop1, prop3
const obj = data.map(({prop1, prop3}) => {
    return {prop1, prop3};
});

目前 obj 的结果是

[{"prop1":1,"prop3":3},{"prop1":10,"prop3":30},{},{"prop3":3000}]

我不想使用循环,就像“电源”一样。解构! ;)

2 个答案:

答案 0 :(得分:2)

如果您坚持解构,则必须使用eval

const reqProps = ['prop2','prop3','prop4'];

const literalString = '{'+reqProps.join(',')+'}';

const obj = data.map(new Function(literalString, 'return '+literalString));

你真的应该使用循环 - 你也可以在辅助函数中隐藏它或只使用reduce

答案 1 :(得分:2)

正如@Bergi建议的那样,你最好以某种方式使用循环。

这是一个带隐式循环的变体:

data.map(o => reqProps.filter(p => p in o)
                      .reduce((acc, p) => ({...acc, [p]: o[p]}), {}))