javascript - ES6 中按键过滤对象属性

Question

假设我有一个对象:

{
  item1: { key: 'sdfd', value:'sdfd' },
  item2: { key: 'sdfd', value:'sdfd' },
  item3: { key: 'sdfd', value:'sdfd' }
}

我想通过过滤上面的对象来创建另一个对象，所以我有类似的东西。

 {
    item1: { key: 'sdfd', value:'sdfd' },
    item3: { key: 'sdfd', value:'sdfd' }
 }

我正在寻找一种使用 Es6 完成此任务的干净方法，因此我可以使用扩展运算符。

Answer 1

如果您有允许值的列表，则可以使用以下方法轻松将它们保留在对象中:

const raw = {
  item1: { key: 'sdfd', value:'sdfd' },
  item2: { key: 'sdfd', value:'sdfd' },
  item3: { key: 'sdfd', value:'sdfd' }
};

const allowed = ['item1', 'item3'];

const filtered = Object.keys(raw)
  .filter(key => allowed.includes(key))
  .reduce((obj, key) => {
    obj[key] = raw[key];
    return obj;
  }, {});

console.log(filtered);

这使用:

1. Object.keys列出 raw(原始数据)中的所有属性，然后
2. Array.prototype.filter选择允许列表中存在的键，使用
   1. Array.prototype.includes确保他们在场
3. Array.prototype.reduce构建一个仅具有允许属性的新对象。

这将使用允许的属性进行浅复制(但不会复制属性本身)。

您还可以使用the object spread operator创建一系列对象而不改变它们(感谢 rjerue for mentioning this ):

const raw = {
  item1: { key: 'sdfd', value:'sdfd' },
  item2: { key: 'sdfd', value:'sdfd' },
  item3: { key: 'sdfd', value:'sdfd' }
};

const allowed = ['item1', 'item3'];

const filtered = Object.keys(raw)
  .filter(key => allowed.includes(key))
  .reduce((obj, key) => {
    return {
      ...obj,
      [key]: raw[key]
    };
  }, {});

console.log(filtered);

出于琐事的目的，如果您想从原始数据中删除不需要的字段(我不建议这样做，因为它涉及一些丑陋的突变)，您可以反转 包括检查如下:

const raw = {
  item1: { key: 'sdfd', value:'sdfd' },
  item2: { key: 'sdfd', value:'sdfd' },
  item3: { key: 'sdfd', value:'sdfd' }
};

const allowed = ['item1', 'item3'];

Object.keys(raw)
  .filter(key => !allowed.includes(key))
  .forEach(key => delete raw[key]);

console.log(raw);

我添加此示例是为了展示基于突变的解决方案，但我不建议使用它。