通过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);它使用：Object.keys列出raw（原始数据）中的所有属性，然后Array.prototype.filter 选择存在于允许列表中的键，使用Array.prototype.includes 确保它们存在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);我包括此示例以展示基于变异的解决方案，但我不建议使用它。

Answer 2

如果您是使用ES6语法OK，我发现，最干净的方式来做到这一点，因为注意到这里和这里是：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 item2const { item2: someVarName, ...newData } = data; // Assign item2 to someVarNameconst { item2: _, ...newData } = data; // Assign item2 to _const { ['item2']: _, ...newData } = data; // Convert string to key first, ...这样不仅可以将您的操作简化为单行，而且还不需要您知道其他键（要保留的键）是什么。

Answer 3

没有外部库的Modern JS一行中的另一种解决方案。我正在玩“ 解构 ”功能：const raw = {    item1: { key: 'sdfd', value: 'sdfd' },    item2: { key: 'sdfd', value: 'sdfd' },    item3: { key: 'sdfd', value: 'sdfd' }  };var myNewRaw = (({ item1, item3}) => ({ item1, item3 }))(raw);console.log(myNewRaw);