javascript - 如何根据动态定义的变量解构对象

标签 javascript ecmascript-6 destructuring object-destructuring

我正在处理一个不可变对象(immutable对象),我需要从中添加和减去一个值数组。

我知道可以通过以下方式使用 ES6 进行破坏。

const {countries, remainder} = someObj // {countries:...,languages:..., ...keys};

这将使我得到剩下的是没有国家键的新对象。

因此我发现我可以在数组上使用 reduce 来遍历并删除对象中的所有值,最后返回一个新对象,使用默认参数,作为原始对象。

但是,我不确定该怎么做,因为键的名称是在数组中定义的。

arrayToRemove.reduce((total, value) => {
  const { extractValue: [value], ...remainder } = total
  return remainder;
}, { ...originalObj });

arrayToRemove.reduce((total, value) => {
  const { [extractValue], ...remainder } = total
  return remainder;
}, { ...originalObj });

我希望最终得到一个新对象,它没有包含在名为 arrayToRemove 的数组中的键。

我需要在保持不变性的同时做到这一点,所以我不能只是循环遍历原始对象并将它们从中删除,所以我认为上面的方法是一个很好的方法。

感谢任何帮助。

最佳答案

你可以使用 computed property names以虚拟对象作为目标属性。

在这里阅读更多:object property assignment pattern [YDKJS: ES6 & Beyond]

var originalObj = { foo: 1, bar: 2, baz: 3, },
    arrayToRemove = ['foo', 'bar'],
    result = arrayToRemove.reduce((total, key) => {
        const { [key]: dummy, ...remainder } = total;
        return remainder;
    }, originalObj);


console.log(result);

关于javascript - 如何根据动态定义的变量解构对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54064859/

相关文章:

javascript - ES6 解构赋值在最新的 Node 中不起作用

javascript - JavaScript 中的 const 和 const {} 有什么区别

javascript - 如何让多次点击按钮做不同的事情

c# - jqModal 取消从 Iframe 打开但显示在父窗口中的警报框

javascript - javascript 对象如何可以只有属性而没有预定义的键

javascript - 我可以在 es6 数组解构中使用什么作为占位符?

javascript - 如何访问在类的方法中声明的变量?

javascript - 从每个对象数组中获取最大值

javascript - 类型 'length' 上不存在属性 '{ [key: number]: any[]; }' 。在 React/Angular 中的状态变量中

javascript - Safari 中的绝对定位 float 标题抖动