通过另一个过滤器对象过滤对象数组

Question

我有一系列遵循以下结构的对象：

{
  "level": 1
  "objectId": "3756"
  "objectIdNo": 35636
  "wpId": "3635473"
}

我现在想通过另一个对象过滤这些对象的数组。这filterObject将具有以下结构：

// filterObject
{
  level: "2"
  objectId: "10"
  wpId: "1"
}

但这filterObject并不总是具有所有键值对，因为它们是在 UI 中手动设置的。结果filterObject也可以是这样的：

{
  level: "2"
}

我的目标是返回与filteredObjects此匹配的新数组filterObject。当仅存在一个过滤器时，filterObject我想返回与这一键值对匹配的所有对象。但是，如果存在更多过滤器，filterObject我想返回与两个键值对（不仅仅是一个）匹配的所有对象。

例子：

这是我要过滤的数据：

[
  {
    "level": "1"
    "objectId": "11"
    "objectIdNo": "320"
    "wpId": "123"
  },
  {
    "level": "2"
    "objectId": "12"
    "objectIdNo": "321"
    "wpId": "123"
  },
  {
    "level": "2"
    "objectId": "13"
    "objectIdNo": "322"
    "wpId": "120"
  },
]

1.

如果这是我的filterObject：

{
  "level": "2"
}

返回：

[
  {
    "level": "2"
    "objectId": "12"
    "objectIdNo": "321"
    "wpId": "123"
  },
  {
    "level": "2"
    "objectId": "13"
    "objectIdNo": "322"
    "wpId": "120"
  },
]

2.

如果这是我的filterObject：

{
  "level": "2",
  "wpId": "123"
}

返回：

[
  {
    "level": "2"
    "objectId": "12"
    "objectIdNo": "321"
    "wpId": "123"
  },
]

我希望这能解释我想要实现但我自己无法实现的逻辑。我希望得到一些想法或适用的功能。

这是我已经在 React 中尝试过的。data 变量保存对象数组，filter 变量保存filterObjects.

useEffect(() => {
    if (data) {
      const filtered = data.filter((task) => {
        if (!filter) {
          return true;
        }
        return (
          task.level === filter.level ||
          task.objectId === filter.objectId ||
          task.wpId === filter.wpId
        );
      });
      setFilteredTasks(filtered);
    }
  }, [filter]);

通过我的尝试，如果我只设置一个过滤器键值对，我会得到一个空数组，

Answer 1

您可以使用filter、Object.keys和every来实现此结果。

您必须使用filter并传递谓词来判断它是否包含在最终结果中。

在谓词中，循环遍历对象上的所有属性，并匹配它是否filters存在于中。data简单的

data.filter((o) =>Object.keys(filters).every((k) => filters[k] === o[k]));

data.filter((o) =>Object.keys(filters).every((k) => filters[k] === o[k]));