Javascript Array of Object：按多个 AND 条件过滤答案

【问题标题】：Javascript Array of Object: filter by multple AND conditionsJavascript Array of Object：按多个 AND 条件过滤
【发布时间】：2022-01-25 06:02:50
【问题描述】：

我的模拟数据：

[
  {
    "id": 1,
    "first_name": "Suzy",
    "last_name": "Pinnell",
    "email": "spinnell0@utexas.edu",
    "gender": "Agender",
    "image": "http://dummyimage.com/410x239.png/5fa2dd/ffffff",
    "department": "Marketing",
    "job_title": "Quality Control Specialist",
    "skill": "Residential Homes"
   },
  {
    "id": 2,
    "first_name": "Enriqueta",
    "last_name": "Folbig",
    "email": "efolbig1@google.com.br",
    "gender": "Male",
    "image": "http://dummyimage.com/247x244.png/5fa2dd/ffffff",
    "department": "Sales",
    "job_title": "Environmental Specialist",
    "skill": "MMC"
  },
  {
    "id": 3,
    "first_name": "Simmonds",
    "last_name": "Acomb",
    "email": "sacomb2@amazon.co.uk",
    "gender": "Polygender",
    "image": "http://dummyimage.com/315x256.png/dddddd/000000",
    "department": "Human Resources",
    "job_title": "Accountant",
    "skill": "Xilinx"
  },
  {
    "id": 4,
    "first_name": "Bernita",
    "last_name": "Hartman",
    "email": "bhartman3@whitehouse.gov",
    "gender": "Female",
    "image": "http://dummyimage.com/305x275.png/dddddd/000000",
    "department": "Support",
    "job_title": "Account ExecutiveII",
    "skill": "Airframe"
  }
]

我在这里发现了一个类似的问题： javascript filter array multiple conditions

要定义要过滤的内容，他们传递一个对象：

var filter = {
  gender: 'male',
  department: 'Sales'
};

这行得通。它显示了包含两个键的每个对象。

+我试图修改它，所以我可以使用一个数组：*

var filter = {
  gender: ['Male'],
  department: ['Sales', 'Marketing']
};

我的目标是通过数组中的给定值过滤数据。只应显示包含销售和营销中所有男性的项目。

我尝试了包含（内部过滤器和 for in 循环），但它只显示第一个数组的结果，第二个被忽略。我不确定如何在所有数组中实现 AND 条件。

谢谢。

【问题讨论】：

标签： javascript json object filtering

【解决方案1】：

您可以提前存储所有条目，以防止为每个数据对象获取相同的过滤器条目数组。

过滤条目以删除可能的空数组。

然后获取条目并检查值是否是数据之一或过滤器是否包含数组，然后检查过滤器数组是否包含数据中的值。

const
    data = [{ id: 1, first_name: "Suzy", last_name: "Pinnell", email: "spinnell0@utexas.edu", gender: "Agender", image: "http://dummyimage.com/410x239.png/5fa2dd/ffffff", department: "Marketing", job_title: "Quality Control Specialist", skill: "Residential Homes" }, { id: 2, first_name: "Enriqueta", last_name: "Folbig", email: "efolbig1@google.com.br", gender: "Male", image: "http://dummyimage.com/247x244.png/5fa2dd/ffffff", department: "Sales", job_title: "Environmental Specialist", skill: "MMC" }, { id: 3, first_name: "Simmonds", last_name: "Acomb", email: "sacomb2@amazon.co.uk", gender: "Polygender", image: "http://dummyimage.com/315x256.png/dddddd/000000", department: "Human Resources", job_title: "Accountant", skill: "Xilinx" }, { id: 4, first_name: "Bernita", last_name: "Hartman", email: "bhartman3@whitehouse.gov", gender: "Female", image: "http://dummyimage.com/305x275.png/dddddd/000000", department: "Support", job_title: "Account ExecutiveII", skill: "Airframe" }],
    filter = { last_name: [], gender: ['Male'], department: ['Sales', 'Marketing'] },
    filterEntries = Object
        .entries(filter)
        .filter(([, v]) => !Array.isArray(v) || v.length),
    result = data.filter(o => filterEntries.every(([k, v]) =>
        o[k] === v ||
        Array.isArray(v) && v.includes(o[k])
    ));

console.log(result);

【讨论】：

如果没有空数组，此解决方案有效。
@VornameNachname，现在可以检查空数组。请参阅编辑。

【解决方案2】：

这是一个很好的 every 用例 :)

const data = [
  {
    "id": 1,
    "first_name": "Suzy",
    "last_name": "Pinnell",
    "email": "spinnell0@utexas.edu",
    "gender": "Agender",
    "image": "http://dummyimage.com/410x239.png/5fa2dd/ffffff",
    "department": "Marketing",
    "job_title": "Quality Control Specialist",
    "skill": "Residential Homes"
   },
  {
    "id": 2,
    "first_name": "Enriqueta",
    "last_name": "Folbig",
    "email": "efolbig1@google.com.br",
    "gender": "Male",
    "image": "http://dummyimage.com/247x244.png/5fa2dd/ffffff",
    "department": "Sales",
    "job_title": "Environmental Specialist",
    "skill": "MMC"
  },
  {
    "id": 3,
    "first_name": "Simmonds",
    "last_name": "Acomb",
    "email": "sacomb2@amazon.co.uk",
    "gender": "Polygender",
    "image": "http://dummyimage.com/315x256.png/dddddd/000000",
    "department": "Human Resources",
    "job_title": "Accountant",
    "skill": "Xilinx"
  },
  {
    "id": 4,
    "first_name": "Bernita",
    "last_name": "Hartman",
    "email": "bhartman3@whitehouse.gov",
    "gender": "Female",
    "image": "http://dummyimage.com/305x275.png/dddddd/000000",
    "department": "Support",
    "job_title": "Account ExecutiveII",
    "skill": "Airframe"
  }
]

const filter = {
  gender: ['Male'],
  department: ['Sales', 'Marketing']
}

const result = data.filter(item => (
  Object.entries(filter).every(([key, arr]) => arr.includes(item[key]))
))

console.log(result)

【讨论】：

【解决方案3】：

您可以否定includes 调用，而不是否定=== 运算符：

data = data.filter(function(item) {
  for (var key in filter) {
    if (item[key] === undefined || !filter[key].includes(item[key]))
      return false;
  }
  return true;
});

【讨论】：

我试过了。没用。如果我在数组中有多个项目，则根本没有结果。这有效：``` var filter = { 性别：['Male']，部门：['Sales''] }; ``` 这不是：``` var filter = { 性别：['男性']，部门：['销售'，'营销'] }; ```
@VornameNachname 哎呀，我在|| 之后切换filter 和item。已编辑和修复。
这没有给我任何结果。

【解决方案4】：

您可以通过迭代您的过滤器对象来实现您的预期结果，并且在每次迭代时，检查目标对象是否可以通过您的过滤器（在下面的 sn-p 中，我使用了 Object.entries 和 every 方法来做那），像这样：

const data = [
  {
    "id": 1,
    "first_name": "Suzy",
    "last_name": "Pinnell",
    "email": "spinnell0@utexas.edu",
    "gender": "Agender",
    "image": "http://dummyimage.com/410x239.png/5fa2dd/ffffff",
    "department": "Marketing",
    "job_title": "Quality Control Specialist",
    "skill": "Residential Homes"
   },
  {
    "id": 2,
    "first_name": "Enriqueta",
    "last_name": "Folbig",
    "email": "efolbig1@google.com.br",
    "gender": "Male",
    "image": "http://dummyimage.com/247x244.png/5fa2dd/ffffff",
    "department": "Sales",
    "job_title": "Environmental Specialist",
    "skill": "MMC"
  },
  {
    "id": 3,
    "first_name": "Simmonds",
    "last_name": "Acomb",
    "email": "sacomb2@amazon.co.uk",
    "gender": "Polygender",
    "image": "http://dummyimage.com/315x256.png/dddddd/000000",
    "department": "Human Resources",
    "job_title": "Accountant",
    "skill": "Xilinx"
  },
  {
    "id": 4,
    "first_name": "Bernita",
    "last_name": "Hartman",
    "email": "bhartman3@whitehouse.gov",
    "gender": "Female",
    "image": "http://dummyimage.com/305x275.png/dddddd/000000",
    "department": "Support",
    "job_title": "Account ExecutiveII",
    "skill": "Airframe"
  }
];

const filter = {
  gender: ['Male'],
  department: ['Sales', 'Marketing']
}

const createFilterFun = filters => obj => Object.entries(filters).every( ([k, v]) => v.includes(obj[k]) );
const filterByGenderAndDepratment = createFilterFun(filter);
const result = data.filter(filterByGenderAndDepratment);
console.log(result)

【讨论】：

【解决方案5】：

试试这个

var itemsFilter = {
  gender: ['Male'],
  department: ['Sales', 'Marketing']
};
users= users.filter (function(item) {
  var find=false;
  for (var key in itemsFilter) {
   find=false;
   if (item[key] === undefined) return false;
    for (var k in itemsFilter[key]) 
      if (itemsFilter[key][k] == item[key]) find=true;
      if (find==false) return false;
   };
return find;
});

【讨论】：