Question

我有两个数组，想从data数组中过滤结果。

var data = [{"role":"Frontend", "languages": ["HTML", "CSS", "JavaScript"]},{"role":"Fullstack", "languages": ["JavaScript"]}]
var selectItem = ["CSS"];

从UI中选择对象data后，会将对象添加到selectItem []。

我想通过针对data从selectItem数组进行过滤来输出。

但是selectItem可以同时包含role和languages中的值。

赞：

var selectItem = ["Frontend","CSS"];

我试图过滤出结果：

  var users = this.myJson.filter(
        (el) =>
          this.selectItem.includes(el.role) ||
          el.languages.some((e1) => this.selectItem.indexOf(e1) >= 0)
      );
      console.log(users);

那么，如何使用多个键过滤data数组？此查询从languages进行过滤，但没有从role进行过滤。

更新：

我尝试的查询正在工作，但是在将新项添加到selectedItem时，如：

 var selectItem = ["Frontend","CSS", "HTML"];

由于它包含CSS，因此它仍将返回所有值。

因此，如果结果包含CSS中所有HTML和Frontend和data的所有标记，我想过滤结果。

var data = [
{"role":"Frontend", "languages": ["HTML", "CSS", "JavaScript"]},
{"role":"Fullstack", "languages": ["JavaScript"]},
{"role":"Frontend", "languages": ["CSS","JavaScript"]}

]

var selectItem = ["Frontend","CSS", "HTML"];

var users=data.filter(el => selectItem.length &&
   (selectItem.includes(el.role) ||
    el.languages.some(e1 => selectItem.includes(e1)) )
);
console.log(users);

我的预期输出是：

[{
  languages: ["HTML", "CSS", "JavaScript"],
  role: "Frontend"
}]

使用数组对象中的多个键进行过滤的最佳方法是什么？

Answer 1

与我第一次尝试读到的内容相反，您正在寻找的是那些满足全部关键字条件的元素，而不仅仅是其中一些。为了满足这一要求，我再次更改了答案：

var data = [
{"role":"Frontend", "languages": ["HTML", "CSS", "JavaScript"]},
{"role":"Fullstack", "languages": ["JavaScript"]},
{"role":"Frontend", "languages": ["CSS","JavaScript"]}];

var sel = ["Frontend","CSS","HTML"];

var users=data.filter(el => {
  if (sel&&sel.length){
//  let elall=[el.role].concat(el.languages);
    let elall=[el.role,...el.languages]; // <-- Aakash Bashyal <3
    return sel.every(se=>elall.includes(se))
  }
});
console.log(users);

在我的代码中，我创建了一个本地临时数组elall，其中包含来自两个属性（role和languages）的元素中关键字的 all 。现在，.every()上的sel方法检查sel数组中是否找到elall中的每个关键字。

Answer 2

这将提供所需的结果：

data.filter(d => 
    selectItem.includes(item => item == d.role) || 
    selectItem.some(item => d.languages.find(lang => lang == item))
);

如何通过另一个数组中的多个值过滤数组

2 个答案: