Array filter with array loop inside

Question

I have two arrays, one with existing tags of book and another with searched results by user input value of tag to add and I need to show user tags to add that doesn't already exist in tags:

tags = [{id:1, name:'x'},{id:2, name:'y'},{id:5, name:'z'}]
search = [{id:2, name:'y'},{id:5, name:'z'},{id:15, name:'s'}]

How can I make a new array that will have search id's and other data that doesn't exist in tags array?

This is how it's worked for me in the end:

let newArray= search
  .filter(({ id }) => {
    return !tags.some(tag => {
      return tag.id == id
    })
  })
  .map(tag => {
    return (
      <Button
        key={tag.id}
      >
        {tag.name}
      </Button>
    )
  })

Use indexOf to check whether the current tags item you are looking at, is contained in search …? — 04FS
– 04FS, Commented Mar 11, 2019 at 11:21
Possible duplicate of How to get the difference between two arrays of objects in JavaScript and check the difference between two arrays of objects in javascript — adiga
– adiga, Commented Mar 11, 2019 at 11:27

ellipsis · Accepted Answer · 2019-03-11 11:35:23Z

2

Using map get all the values in the object in the tags array. Run a filter on the search array and if the id is not present in the above created array , return it

var tags = [{id:1, name:'x'},{id:2, name:'y'},{id:5, name:'z'}]
var search = [{id:2, name:'y'},{id:5, name:'z'},{id:15, name:'s'}]
console.log(search.filter(({id,name})=>!tags.find(e=>e.id==id && e.name==name)))

edited Mar 11, 2019 at 11:35

answered Mar 11, 2019 at 11:22

ellipsis

12.2k2 gold badges19 silver badges33 bronze badges

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

1 Comment

ZiiMakc Over a year ago

updated question, there is many values in one item, so i need to save them.

Carlos Lombardi · Accepted Answer · 2019-03-11 11:30:40Z

1

I assume that the desired result in the example is {id:15}, since 15 is the only value in search that is not present in tags.

In that case, you should filter the search array, rather than the tags one. The condition is that the searched is not found in tags. The find method comes to the rescue here.

The actual code may look like this

let filtered = search.filter(searched =>
    !tags.find(tagged => tagged.id === searched.id)
)

Hope it helps - Carlos

answered Mar 11, 2019 at 11:30

Carlos Lombardi

3692 silver badges9 bronze badges

1 Comment

ZiiMakc Over a year ago

ye, but i used some instead of find

jo_va · Accepted Answer · 2019-03-11 12:45:22Z

1

You can use filter and find or some to do it in a single line:

const tags = [{id:1},{id:2},{id:5}];
const search = [{id:2},{id:5},{id:15}];

const result1 = search.filter(({ id }) => !tags.some(tag => tag.id === id));
const result2 = search.filter(({ id }) => !tags.find(tag => tag.id === id));

console.log(result1, result2);

If you use an older version of JavaScript, here is a version without arrow functions and destructuring:

const tags = [{id:1},{id:2},{id:5}];
const search = [{id:2},{id:5},{id:15}];

const result1 = search.filter(search => { return !tags.some(tag => { return tag.id === search.id; }); });
const result2 = search.filter(search => { return !tags.find(tag => { return tag.id === search.id; }); });

console.log(result1, result2);

edited Mar 11, 2019 at 12:45

answered Mar 11, 2019 at 11:22

jo_va

14.1k3 gold badges25 silver badges49 bronze badges

6 Comments

adiga Over a year ago

You can use some instead of find

jo_va Over a year ago

@adiga, you are totally right, I will update the answer

ZiiMakc Over a year ago

you need to add return for .some

jo_va Over a year ago

@RTW, no you don't need that as there is no block around it so the return is implicit

ZiiMakc Over a year ago

without return it doesn't work for me for some reason. Added worked version in question.

|

GBrandt · Accepted Answer · 2019-03-11 11:26:03Z

0

I think what you want is:

search.filter(searchTag => tags.every(tag => tag.id != searchTag.id))

edited Mar 11, 2019 at 11:26

answered Mar 11, 2019 at 11:21

GBrandt

6854 silver badges11 bronze badges

1 Comment

VLAZ Over a year ago

!arr.some(x => x === anything) is equivalent to arr.every(x => x !== anything) and the latter is easier to read because it doesn't rely on keeping the ! in mind for the entire rest of the expression.

ZiiMakc · Accepted Answer · 2019-03-11 12:40:05Z

0

This is how it works for me:

let newArray= search
      .filter(({ id }) => {
        return !tags.some(tag => {
          return tag.id == id
        })
      })
      .map(tag => {
        return (
          <Button
            key={tag.id}
          >
            {tag.name}
          </Button>
        )
      })

answered Mar 11, 2019 at 12:40

ZiiMakc

37.7k26 gold badges79 silver badges128 bronze badges

Collectives™ on Stack Overflow

Array filter with array loop inside

5 Answers 5

1 Comment

1 Comment

6 Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

1 Comment

1 Comment

6 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related