JS Array of Objects filter out values in an Array

Question

I've been struggling to filter an array of objects.

I have an array of objects like this:

const arrayOne = [
    {userid: 111, photo: “blahblahlbha”}
    {userid: 222, photo: “blahblahlbha”}
    {userid: 333, photo: “blahblahlbha”}
    {userid: 444, photo: “blahblahlbha”}
    {userid: 555, photo: “blahblahlbha”}
]

And an array like this:

Const arrayTwo = [
    111,
    333
}

I want to create an updated arrayOne (arrayThree) like this (remove userid's found in arrayTwo)

const arrayThree = [
    {userid: 222, photo: “blahblahlbha”}
    {userid: 444, photo: “blahblahlbha”}
    {userid: 555, photo: “blahblahlbha”}
]

I've tried a few variations of below without much luck:

const arrayThree = Object.keys(arrayOne).filter((k) => !arrayTwo.includes(arrayOne[k].userid))

What can I try next?

Harun Yilmaz · Accepted Answer · 2020-05-13 12:00:56Z

2

You don't need Object.keys(). Just use Array.filter()

And also there are some syntax errors in your code.

You need to add commas (,) between array items in arrayOne.
The quotation marks (") are not actually quotation marks, you need to convert them as well.
You need to close the arrayTwo with square bracket (]), not with curly brace (}).

const arrayOne = [
    {userid: 111, photo: "blahblahlbha"},
    {userid: 222, photo: "blahblahlbha"},
    {userid: 333, photo: "blahblahlbha"},
    {userid: 444, photo: "blahblahlbha"},
    {userid: 555, photo: "blahblahlbha"}
]

const arrayTwo = [
    111,
    333
]

const arrayThree =  arrayOne.filter(item => !arrayTwo.includes(item.userid))

console.log(arrayThree)

answered May 13, 2020 at 12:00

Harun Yilmaz

8,5793 gold badges30 silver badges40 bronze badges

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

1 Comment

Harun Yilmaz Over a year ago

@Soham You're right. But the question is about filtering out items based on another array. Maybe OP can use a polyfill with Array.indexOf() method, if needed.

Yousaf · Accepted Answer · 2020-05-13 12:02:39Z

1

You can achieve the desired result using reduce function. Iterate over arrayOne, check if userid of current object is present in arrayTwo, if not present, add current object to new array that will be returned by reduce function

const arrayOne = [
    {userid: 111, photo: 'blahblahlbha'},
    {userid: 222, photo: 'blahblahlbha'},
    {userid: 333, photo: 'blahblahlbha'},
    {userid: 444, photo: 'blahblahlbha'},
    {userid: 555, photo: 'blahblahlbha'},
];

const arrayTwo = [
    111,
    333
];

const arrayThree = arrayOne.reduce((acc, curr) => {
  if (!arrayTwo.includes(curr.userid)) {
    acc.push(curr);
  }
  
  return acc;
}, []);

console.log(arrayThree);

answered May 13, 2020 at 12:02

Yousaf

29.5k6 gold badges54 silver badges78 bronze badges

2 Comments

Rayon Over a year ago

IMO, This is an ideal use case for Array#filter.

Yousaf Over a year ago

@Rayon agreed but as another person posted a solution using filter function, i posted another approach to solve this problem

Siva Kondapi Venkata · Accepted Answer · 2020-05-13 12:04:24Z

1

Use filter and includes. (There are some typos in data, fixed as below)

const arrayOne = [
  { userid: 111, photo: "blahblahlbha" },
  { userid: 222, photo: "blahblahlbha" },
  { userid: 333, photo: "blahblahlbha" },
  { userid: 444, photo: "blahblahlbha" },
  { userid: 555, photo: "blahblahlbha" }
];

const arrayTwo = [111, 333];

const arrayThree = arrayOne.filter(({ userid }) => !arrayTwo.includes(userid));

console.log(arrayThree);

answered May 13, 2020 at 12:04

Siva Kondapi Venkata

11.1k2 gold badges20 silver badges32 bronze badges

Comments

Anoop SG · Accepted Answer · 2020-05-13 12:10:18Z

0

Try this.

const arrayOne = [
    {userid: 111, photo: "blahblahlbha"},
    {userid: 222, photo: "blahblahlbha"},
    {userid: 333, photo: "blahblahlbha"},
    {userid: 444, photo: "blahblahlbha"},
    {userid: 555, photo: "blahblahlbha"},
]

const arrayTwo = [
    111,
    333
];

const arrayThree = arrayOne.filter(item => !arrayTwo.includes(item.userid));

answered May 13, 2020 at 12:10

Anoop SG

1511 silver badge3 bronze badges

Comments

Soham · Accepted Answer · 2020-05-13 14:11:17Z

0

Many used includes method of Array which doesn't support in Internet Explorer so using indexOf is a better option always.

const arrayOne = [
    {userid: 111, photo: "blahblahlbha"},
    {userid: 222, photo: "blahblahlbha"},
    {userid: 333, photo: "blahblahlbha"},
    {userid: 444, photo: "blahblahlbha"},
    {userid: 555, photo: "blahblahlbha"},
]

const arrayTwo = [
    111,
    333
];

const arrayThree = arrayOne.filter(item => arrayTwo.indexOf(item.userid) < 0);

console.log(arrayThree)

answered May 13, 2020 at 14:11

Soham

7253 silver badges19 bronze badges

Collectives™ on Stack Overflow

JS Array of Objects filter out values in an Array

5 Answers 5

1 Comment

2 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

1 Comment

2 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related