在 ES6 中按键过滤对象属性 [英] Filter object properties by key in ES6

查看:23
本文介绍了在 ES6 中按键过滤对象属性的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

假设我有一个对象:

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

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

I want to create another object by filtering the object above so I have something like.

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

我正在寻找一种使用 Es6 完成此操作的简洁方法,因此我可以使用扩展运算符.

I am looking for a clean way to accomplish this using Es6, so spread operators are available to me.

推荐答案

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

If you have a list of allowed values, you can easily retain them in an object using:

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. Object.keys to list all properties in raw (the original data), then
  2. Array.prototype.filter to select keys that are present in the allowed list, using
  1. Array.prototype.includes 以确保它们存在

  • Array.prototype.reduce 构建一个仅具有允许属性的新对象.
  • 这将使用允许的属性进行浅拷贝(但不会复制属性本身).

    This will make a shallow copy with the allowed properties (but won't copy the properties themselves).

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

    You can also use the object spread operator to create a series of objects without mutating them (thanks to 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);

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

    For purposes of trivia, if you wanted to remove the unwanted fields from the original data (which I would not recommend doing, since it involves some ugly mutations), you could invert the includes check like so:

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

    我包含这个例子是为了展示一个基于突变的解决方案,但我不建议使用它.

    I'm including this example to show a mutation-based solution, but I don't suggest using it.

    这篇关于在 ES6 中按键过滤对象属性的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

    查看全文
    登录 关闭
    扫码关注1秒登录
    发送“验证码”获取 | 15天全站免登陆