javascript - ES6 中简单解构数组/对象

标签 javascript ecmascript-6 destructuring

我正在尝试使用选定的键返回新对象 - reqProps。我设法通过修复 props 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}]

我不想使用循环,就像解构的“力量”一样! ;)

最佳答案

如果你坚持解构,你必须使用eval:

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

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

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

您确实应该使用循环 - 您也可以将其隐藏在辅助函数中或仅使用 reduce

关于javascript - ES6 中简单解构数组/对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46063766/

相关文章:

javascript - jQuery - 等待淡入淡出完成的正确方法

javascript - 无法进行条件渲染

javascript - ES5/6/Next 在 JavaScript 中对数组进行分组或 block 迭代的方法

javascript - 解构时访问传入的父对象

javascript - 如何修复 Eslint prefer-destructuring

javascript - 调用包含的js文件中的函数

javascript - chrome.storage.sync.get 与外部对象同步,但内部对象不同步?

javascript - Google Analytics 页面内分析是如何工作的?

javascript - 如何将 TypeScript 转换为 ES6?

arrays - 解构数组时的类型