在 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 完成此任务的干净方法，因此我可以使用扩展运算符。

原文由 29er 发布，翻译遵循 CC BY-SA 4.0 许可协议

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 选择允许列表中存在的键，使用

3. Array.prototype.includes 以确保它们存在

4. Array.prototype.reduce 构建一个仅具有允许属性的新对象。

这将使用允许的属性进行浅拷贝（但不会复制属性本身）。

您还可以使用 对象扩展运算符 创建一系列对象而不改变它们（感谢 rjerue 提到这一点）：

 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);

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

 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);

我包括这个例子来展示一个基于突变的解决方案，但我不建议使用它。

原文由 ssube 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

如果您可以使用 ES6 语法，我发现最简洁的方法是，如此 处和此处 所述：

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

const { item2, ...newData } = data;

现在， newData 包含：

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

或者，如果您将密钥存储为字符串：

 const key = 'item2';
const { [key]: _, ...newData } = data;

在后一种情况下， [key] 转换为 item2 但由于您使用的是 const 赋值，因此您需要指定一个赋值名称。 _ 表示丢弃值。

更普遍：

 const { item2, ...newData } = data; // Assign item2 to item2
const { item2: someVarName, ...newData } = data; // Assign item2 to someVarName
const { item2: _, ...newData } = data; // Assign item2 to _
const { ['item2']: _, ...newData } = data; // Convert string to key first, ...

这不仅将您的操作减少到一行，而且还不需要您知道其他键是什么（那些您想要保留的键）。

一个简单的效用函数如下所示：

 function removePropFromObject(obj, prop) {
  const { [prop]: _, ...rest } = obj
  return { ...rest }
}

原文由 Ryan H. 发布，翻译遵循 CC BY-SA 4.0 许可协议