How can I get objects in my array to only show up once? JavaScript

Question

Hey I'm struggling and was hoping that maybe someone here could help. I'm making a web app that uses a big array of objects that looks similar to this:

var arr = [
{
    prop1 : "foo",
    prop2 : ["foo1", "foo2", "foo3", "foo4"],
    prop3 : "foo5",
    prop4 : "foo6",
},
{
    prop1 : "bar",
    prop2 : ["bar1", "bar2", "bar3", "bar4"],
    prop3 : "bar5",
    prop4 : "bar6",
}, 
{
    prop1 : "something",
    prop2 : ["something1", "something2", "something3", "something4"],
    prop3 : "something5",
    prop4 : "something6",
}
]

The array is much bigger than that but you get the idea. I want to display only 5 objects from the array at random each time the code is run which I did like this:

randomArr = arr.sort(() => Math.random() - .5);
spliceArr = randomArr.splice(5);

It works, but it sometimes shows objects from the main array multiple times. How can I write the code so the it will return objects from the array only once?

There are several ways to do this, how about at the start of your code, generate 5 random, unique indices, and then return the objects at that index. — Alan
– Alan, Commented Jan 19, 2022 at 19:25
That's not a bad idea, but I may need to change the amount of items it displays in the future with an if statement. Do you know if there's a way to return the objects similarly to how I wrote it here, maybe using a different method? — Nate
– Nate, Commented Jan 19, 2022 at 19:28
The number of objects to display is essentially the number of indices to generate. You could pass that number as a function parameter. In your code, you are randomly sorting the array, then returning the first 5 elements. — Alan
– Alan, Commented Jan 19, 2022 at 19:33
Also, in javascript, sort() modifies the array in place, so the assignment to randomArr is superfluous. — Alan
– Alan, Commented Jan 19, 2022 at 19:36

Alan · Accepted Answer · 2022-01-19 21:45:09Z

1

You could solve this by creating an array of unique random indicies, then return an array of objects that correspond to those random indices.

A set can be used to ensure all generated indices are unique.

function getNRandomObjects(objectArray,numberOfObjects) {

  // use a set to ensure at most only one instance of an index is
  // generated
  const indices = new Set();

  while(indices.size < numberOfObjects) {
    //generate a random index and add it to the set
    indices.add( Math.floor(Math.random() * objectArray.length));
  }

  // convert the set of indices into an array, 
  // then map each index to the object that corresponds
  // to that index.
  return Array.from(indices).map(i=>objectArray[i]);
}

edited Jan 19, 2022 at 21:45

answered Jan 19, 2022 at 19:44

Alan

47k20 gold badges118 silver badges138 bronze badges

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

Collectives™ on Stack Overflow

How can I get objects in my array to only show up once? JavaScript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related