JavaScript数组搜索过滤器

Question

我有场景，提供了示例JSON数据：

[{
   "name": "Joe",
   "age": "28",
   "hobby": ["Reading", "Chilling", "Cycling"]
},
{
   "name": "Beck",
   "age": "25",
   "hobby": ["Drinking", "Cycling"]
},
{
   "name": "Candace",
   "age": "24",
   "hobby": ["Reading", "Singing"]
}]

假设上面的数组显示在网页的某些列表中。

我有2（两个）搜索下拉菜单，可以选择多个名称和年龄。

• 以名字来说，它显示了所有不同的爱好（阅读，放松，骑自行车，喝酒，唱歌）。
• 对于年龄，假设它有2个年龄段选项：23-26和> 27。

为了搜索爱好，我的代码是（在ReactJS中：]

filteredPersons = this.state.personList.filter( person =>{
  return person.hobby.some(v=> filterHobby.indexOf(v) !== -1)
});

是：

• personList是来自上面JSON的数组列表；
• [filterHobby是来自多个选择的数组列表，例如：如果filterHobby = ["Reading","Singing"]，它将显示Joe和Candace。

问题是，如何选择多项选择年龄？

预期结果：

• 选择23-26 仅将显示Beck和Candace
• 选择>27 仅将显示Joe
• 选择同时显示贝克，坎迪斯和乔

谢谢您的回答。

Answer 1

您需要对数组[[过滤使用filter函数。

我们有一个与人组成的数组：

const persons = [
    {
       "name": "Joe",
       "age": "28",
       "hobby": ["Reading", "Chilling", "Cycling"]
    },
    {
       "name": "Beck",
       "age": "25",
       "hobby": ["Drinking", "Cycling"]
    },
    {
       "name": "Candace",
       "age": "24",
       "hobby": ["Reading", "Singing"]
    }
]

然后我们将过滤该数组：
persons.filter((person) => {
    return person.age > 27;
})

此代码返回我们
Joe

的信息：

[
  {
    "name": "Joe",
    "age": "28",
    "hobby": ["Reading", "Chilling", "Cycling"]
  }
]

Answer 2

假设这样：选择的选项1 =“ 23-26”；选择的选项2 =“> 27”

filteredPersons = this.state.persons.filter(({age}) => {
 if(selectedOption1) {
  return (age>=23) && (age<=26);
 }
 if(selectedOption2) {
  return (age>27);
 }
})