How to filter JS nested array based on an array of filters?-CodePudding

I have a profileList array that the user should be able to filter. The filter applies to the "tags" nested array.

The user also creates a whitelist of tags that can be added to each profile (one or more tags) in the "tags" nested array.

The the user should be able to filter the profileList array by adding one or more tags to filterArray.

So my problem is to be able to check if at least one of the tags in the filterArray is included in the "tags" nested array within the profileList array.

The code below doesn't work obviously as the filter function checks if "all" filter tags are present in the profileList / tags array.

How can I write the filter function?

Any help much appreciated.

//the array to filter
let profileList = [
                    {name: "John", tags: ["green", "yellow", "red"]}, 
                    {name: "Alex", tags: ["yellow", "white", "purple"]}, 
                    {name: "Jane", tags: ["green", "pink", "blue"]}
                   ]

//user defined: they can add up to 30 statuses
let taglist = ["green", "yellow", "red", "black"...]

//also user defined: they can filter by as many statuses as they want
let filterArray = ["green", "red"]

  
const filteredProfiles = store.state.profileList.filter(element => {
    return filterArray.includes(element.tags);
});

//for ex. if the user decides to add "yellow" and "red" to the filterArray, then the function should return John and Alex

CodePudding user response：

You can use Array.some() to make sure it has at least one tag in the filteredArray

let profileList = [
  {name: "John", tags: ["green", "yellow", "red"]}, 
  {name: "Alex", tags: ["yellow", "white", "purple"]}, 
  {name: "Jane", tags: ["green", "pink", "blue"]}
 ]
 
let filterArray = ["green", "red"]

  
const filteredProfiles = profileList.filter(e1 => {
    return e1.tags.some(e2 => filterArray.includes(e2))
});

console.log(filteredProfiles)

CodePudding user response：

To filter the profileList array by the tags in the filterArray, you can use the

Array.prototype.some()

method to check if at least one of the tags in the filterArray is included in the tags nested array of each element in the profileList array.

Here is an example of how you could update your code to use the Array.prototype.some() method to filter the profileList array:

//the array to filter
let profileList = [
  {name: "John", tags: ["green", "yellow", "red"]}, 
  {name: "Alex", tags: ["yellow", "white", "purple"]}, 
  {name: "Jane", tags: ["green", "pink", "blue"]}
];

//user defined: they can add up to 30 statuses
let taglist = ["green", "yellow", "red", "black"...]

//also user defined: they can filter by as many statuses as they want
let filterArray = ["green", "red"]

  
const filteredProfiles = profileList.filter(element => {
  // check if at least one of the tags in the filterArray is included in the element's tags array
  return filterArray.some(tag => element.tags.includes(tag));
});

In this example, the filter() method is used to filter the profileList array, and the some() method is used to check if at least one of the tags in the filterArray is included in the tags array of each element. This will return only the elements in the profileList array that have at least one of the tags in the filterArray.

In this case, if the user adds "yellow" and "red" to the filterArray, the filteredProfiles array will contain only the objects with the name properties "John" and "Alex", because these are the only objects that have at least one of the tags "yellow" and "red" in their tags arrays.