拨开荷叶行,寻梦已然成。仙女莲花里,翩翩白鹭情。
IMG-LOGO
主页 文章列表 Javascript物件阵列:按多个AND条件过滤

Javascript物件阵列:按多个AND条件过滤

白鹭 - 2022-01-23 2097 0 0

我的模拟资料:

[
  {
    "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 条件。

谢谢你。

uj5u.com热心网友回复:

您可以提前存盘所有条目,以防止获取每个资料物件以获取过滤器的相同条目阵列。

过滤条目以洗掉可能的空阵列。

然后获取条目并检查值是否为资料之一或过滤器是否包含阵列,然后检查过滤器阵列是否包含来自资料的值。

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

uj5u.com热心网友回复:

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

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)

uj5u.com热心网友回复:

===您可以否定includes呼叫而不是否定运算子

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

uj5u.com热心网友回复:

您可以通过迭代过滤器物件来实作预期的结果,并在每次迭代时检查目标物件是否可以通过您的过滤器(在下面我使用的代码片段Object.entriesevery方法中),如下所示:

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)

uj5u.com热心网友回复:

试试这个

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;
});
标签:

0 评论

发表评论

您的电子邮件地址不会被公开。 必填的字段已做标记 *