How to filter an array from an array

Question

I have the following two datasets:

// This is based on what user input, usually they will just select 1 or 2.
var selected = ['alpha', 'bravo', 'charlie', 'delta', ...] 

  var list = [
   {
      "properties":{
         "name" : "Example Name",
         "tags":{
            "multi_select":[
               {
                  "name":"alpha"
               },
               {
                  "name":"charlie"
               }
            ]
         }
      }
   },
    ...
   // same same but many more objects with different tags each
]

Yes, it's super nested, but it comes from an API...

Anyway, so what I'm trying to do now is filter() it based on the selected terms, example, If list tags contain "alpha, charlie" and "alpha" is selected, it would display object, but if "alpha and bravo" is selected, the object won't match.

So with fewer it can match, but when it gets narrowed don't it shouldn't match.

I tried the following:

let res = list.filter(hb => hb.properties.Tags.multi_select.some(tag => tag.name.includes(selected)));
console.log(res);

This code is largely from Javascript array.filter by element in children

So I noticed, if I have selected "charlie" it returns the correct objects(s) that contains tag "charlie", but when I select more than 1, eg "charlie" and "alpha" it returns nothing even though there is suppose to be matching objects.

Any suggestions how I could improve the filtering?

Thanks in advance.

what if multi_select contains more than the two wanted names? — Nina Scholz
– Nina Scholz, Commented May 20, 2021 at 7:42
@NinaScholz that's fine... it should still match... as long as the wanted names from selected doesn't contain something that doesn't exist in multi_select. — Ronald Langeveld
– Ronald Langeveld, Commented May 20, 2021 at 7:44

Nina Scholz · Accepted Answer · 2021-05-20 07:48:45Z

1

You need to check every selected tag agains some name of the filtering object.

let res = list.filter(hb => selected.every(tag =>
    hb.properties.tags.multi_select.some(({ name }) => name === tag)
));

answered May 20, 2021 at 7:48

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Dharman · Accepted Answer · 2021-05-20 07:50:32Z

1

I think the argument of your includes method here shouldn't be an array here, the check should rather be other way around.

let res = list.filter(hb => hb.properties.tags.multi_select.some(tag => selected.includes(tag.name));

Also, one suggestion - It might be more optimal to use Set instead of Array for this use case maybe, if you want to research a bit.

As to why your code is working when you are only having one item, the reason is that the selected array undergoes a string conversion so ["charlie"] becomes charlie which is returned as true as charlie is your first element in the multiselect array. But when you add another item, it happens like this ["alpha", "charlie"] is casted to "alpha,charlie" which is concatenation of two items, so it would naturally return false.

edited May 20, 2021 at 7:50

Dharman♦

33.9k27 gold badges106 silver badges157 bronze badges

answered May 20, 2021 at 7:45

jaybhatt

5562 silver badges7 bronze badges

Collectives™ on Stack Overflow

How to filter an array from an array

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related