javascript - 使用 JS 过滤和搜索 2 个不同的对象数组

Question

我有两个对象数组，我需要弄清楚用另一个数组的对象过滤其中一个数组的最佳方法是什么？

第一个数组称为drinksType

[
  {
    "id": "GROUP1",
    "type": "Water"
  },
  {
    "id": "GROUP2",
    "type": "Beer"
  },
  {
    "id": "GROUP3",
    "type": "Coke"
  },
  {
    "id": "GROUP4",
    "type": "Gin"
  }
]

第二个称为 drinksGroup，它根据 drinksType

进行过滤

[
  {
    "GROUP1": 1,
    "GROUP2": 0,
    "GROUP3": 0,
    "GROUP4": 0
  },
  {
    "GROUP1": 1,
    "GROUP2": 1,
    "GROUP3": 0,
    "GROUP4": 0
  },
  {
    "GROUP1": 0,
    "GROUP2": 0,
    "GROUP3": 1,
    "GROUP4": 0
  },
  {
    "GROUP1": 0,
    "GROUP2": 1,
    "GROUP3": 1,
    "GROUP4": 1
  }
]

想要的结果应该是这样的

[
  {
    "name": "Water"
  },
  {
    "name": "Water Beer"
  },
  {
    "name": "Coke"
  },
  {
    "name": "Beer Coke Gin"
  }
]

因此您可以查看 drinksGroup 中的某个键的值为 1，然后我需要过滤 drinksType 以获取类型。在某些情况下，可能有多个值为 1 的键，在这种情况下，我需要使用所有键过滤 drinksType 并加入类型。叹息!

到目前为止，我的努力是......

const dataKeys = Object.keys(drinksGroup);

drinks.name = [...dataKeys
            .filter((dataKey) => dataKey.match(/GROUP/))
            .filter((dataKey) => data[dataKey] === 1)
        ].join(' ');

这给出了结果

  [
      {
        "name": "GROUP1"
      },
      {
        "name": "GROUP1 GROUP2"
      },
      {
        "name": "GROUP3"
      },
      {
        "name": "GROUP2 GROUP3 GROUP3"
      }
    ]

但我不知道该怎么做。我该怎么做？我正在从事的项目也可以访问 lodash 是否会更容易？非常感谢

Answer 1

var drinksType = [{"id":"GROUP1","type":"Water"},{"id":"GROUP2","type":"Beer"},{"id":"GROUP3","type":"Coke"},{"id":"GROUP4","type":"Gin"}];
var drinksGroup = [{"GROUP1":1,"GROUP2":0,"GROUP3":0,"GROUP4":0},{"GROUP1":1,"GROUP2":1,"GROUP3":0,"GROUP4":0},{"GROUP1":0,"GROUP2":0,"GROUP3":1,"GROUP4":0},{"GROUP1":0,"GROUP2":1,"GROUP3":1,"GROUP4":1}];

var drinksNames = drinksGroup.map((group) => {
    var name = '';
    for (var groupName in group) {
        if (group[groupName]) {
            name += drinksType.find((type) => type.id === groupName).type + ' ';
        }
    }
    return {name: name.slice(0, -1)};
});

console.log(drinksNames);

那行得通吗？

请注意，如果您的目标是 IE，则 Array.prototype.find 不受支持。