Adding Filtering in an array objects duplicated in existing method

Question

I have the following array

 [{ id: 1,
    type: 'video',
    image: null,
    url: 'https://www.youtube.com/1'
  },
  { id: 2,
    type: 'video',
    image: null,
    url: 'https://www.youtube.com/2' 
  },
  { id: 3,
    type: 'image',
    image: 'https://example-1.url.webp'
  },
  { id: 4,
    type: 'image',
    image: 'https://example-2.url.jpg',
  },
  { id: 5,
    type: 'video',
    image: 'https://www.youtube.com/2',
  }   
]

I am already filtering all the items who are not webp format and the image is null

  const galleryFilter = gallery.filter(
    (item) => item?.image?.indexOf("webp") === -1 || item?.image === null
  );

As you can see there are 2 items (id 2 and id 5 ) with the same url, how can i also filter the item duplicated with the same url in the galleryFilter method ?

Does this answer your question? How to remove all duplicates from an array of objects? — Jeremy Thille
– Jeremy Thille, Commented Nov 23, 2021 at 12:35
@Koala7 What do you mean? Your question is an exact duplicate. You want to filter by "image" instead of "name", but that's it. The linked question has 75 answers. How can this not help you? — Jeremy Thille
– Jeremy Thille, Commented Nov 23, 2021 at 12:42
Ok so why you are making me this question if you contest my answer — Koala7
– Koala7, Commented Nov 23, 2021 at 12:43

Azad · Accepted Answer · 2021-11-23 12:52:03Z

1

you can append another filter function to filter by image url, (I have added another object into your data set id: 6)

var gallery =  [{ id: 1,
    type: 'video',
    image: null,
    url: 'https://www.youtube.com/1'
  },
  { id: 2,
    type: 'video',
    image: null,
    url: 'https://www.youtube.com/2' 
  },
  { id: 3,
    type: 'image',
    image: 'https://example-1.url.webp'
  },
  { id: 4,
    type: 'image',
    image: 'https://example-2.url.jpg',
  },
  { id: 5,
    type: 'video',
    image: 'https://www.youtube.com/2',
  },
  { id: 6,
    type: 'video',
    image: 'https://www.youtube.com/2',
  }
];

var galleryFilter = gallery.filter( (item) => item?.image?.indexOf("webp") === -1 || item?.image !== null ).filter((item, i, arr) => i == arr.findIndex(e => e.image == item.image));

console.log(galleryFilter);

answered Nov 23, 2021 at 12:52

Azad

5,2725 gold badges32 silver badges59 bronze badges

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

Comments

Siva Kondapi Venkata · Accepted Answer · 2021-11-26 04:39:31Z

0

Use filter and keep track of images with Set

const gallery = [
  { id: 1, type: "video", image: null, url: "https://www.youtube.com/1" },
  { id: 2, type: "video", image: null, url: "https://www.youtube.com/2" },
  { id: 3, type: "image", image: "https://example-1.url.webp" },
  { id: 4, type: "image", image: "https://example-2.url.jpg" },
  { id: 5, type: "video", image: "https://www.youtube.com/2" },
];

const set = new Set();

const galleryFilter = gallery.filter((item) => {
  if (
    (item?.image?.includes("webp") || item?.image === null) &&
    !set.has(item?.image)
  ) {
    set.add(item.image);
    return true;
  }
});

console.log(galleryFilter)

answered Nov 26, 2021 at 4:39

Siva Kondapi Venkata

11.1k2 gold badges20 silver badges32 bronze badges

Collectives™ on Stack Overflow

Adding Filtering in an array objects duplicated in existing method

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