JavaScript get 3 unique random object from array

Question

What I trying to do is, show random name, I already got it, but I want to show 3 random names from object, and also unique, I mean do not show duplicate. how can I do this?

var items = [{name: 'Tom', phone: '12321'}, {name: 'Jerry', phone: '235677'}, {name: 'Mike', phone: '11209765'}, {name: 'Robert', phone: '5345'}, {name: 'Danny', phone: '1247774'}, {name: 'Josef', phone: '1199900'}, {name: 'Rainbow', phone: '12675'}, {name: 'Avi', phone: '12344'}, {name: 'Shani', phone: '12222767'}];

var item1 = items[Math.floor(Math.random() * items.length)];
var item2 = items[Math.floor(Math.random() * items.length)];
var item3 = items[Math.floor(Math.random() * items.length)];

$('#Name-1').text('Name 1: '+item1.name);
$('#Name-2').text('Name 2: '+item2.name);
$('#Name-3').text('Name 3: '+item3.name);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="Name-1"></div>
<div id="Name-2"></div>
<div id="Name-3"></div>

This work but show duplicate sometimes, like this:

Name 1: Danny
Name 2: Mike
Name 3: Mike

Why ... because there are many many similar questions already. Doesn't the link above do what you need? — charlietfl, Aug 15 '20 at 11:38
@charlietfl nope, I didn't ask how to make random array! I asked how to show 3 unique! random array from object — Jack The Baker, Aug 15 '20 at 11:42
The first answer tells you a very valid approach and explains as *"You could shuffle the array and pick the first four."* which in your case would only be three. How does that not solve your issue? With a little bit of searching on your own you would find other approaches also — charlietfl, Aug 15 '20 at 11:44
@charlietfl But op, asked about array, not object. I told, want three unique, but with that answer, I just can get one random array. — Jack The Baker, Aug 15 '20 at 11:46
And with that shuffled array you just take the first three, or last three...it's not complicated — charlietfl, Aug 15 '20 at 11:48
@charlietfl bro! I don't want first three or last three! please read my question again! I want three different unique random!! — Jack The Baker, Aug 15 '20 at 11:48
Yes and a random shuffle accomplishes what you need. Did you even try it???? The array will be random order each time allowing you to take first or last three from it and thus no duplicates. It doesn't matter that one array is numbers and another is objects...the concept is the same — charlietfl, Aug 15 '20 at 11:49
@charlietfl https://jsfiddle.net/hwr04yca/ see the result please — Jack The Baker, Aug 15 '20 at 11:53
@charlietfl Actually no, everytime I refresh the page (execute the code), see mike for example, I want when it execute, show three different new names. after 5-6 refresh it might not show mike again — Jack The Baker, Aug 15 '20 at 12:02
I don't think this should be a duplicate of the currently linked question. If anything [How to efficiently randomly select array item without repeats?](https://stackoverflow.com/q/17891173/3982562) would be a better duplicate fit than the current one. To answer your question in short, don't only access a random element. Remove it, so it can't be picked again: `items.splice(Math.floor(Math.random() * items.length), 1)[0]` returns a random element from the array and removes it in the process. This does mutate the array so make sure you copy it beforehand if you need the original to be intact. — 3limin4t0r, Aug 15 '20 at 12:04
That was not what was asked in the question. Do you mean never show same name each time a page is loaded? That is more involved since it requires storing what was previously displayed — charlietfl, Aug 15 '20 at 12:06
@3limin4t0r Simple enough to add additional links to the dup link , click on edit and add it. I disagree that the one I selected doesn't match the minimal criteria given in the question. — charlietfl, Aug 15 '20 at 12:08
I agree with @charlietfl the question should be closed as a dup since it never mentions anything about the storing of value and never to show them again if seen once. **The OP needs to add the specific's of what the requirements are** So the question is NOT closed as a duplicate in the first place! — Always Helping, Aug 15 '20 at 12:25
This question should not have been re-opened. There are so many examples of this all over the site such as the dup that was originally linked https://stackoverflow.com/questions/7158654/how-to-get-random-elements-from-an-array — charlietfl, Aug 15 '20 at 15:12

Akshay Bande · Answer 1 · 2020-08-15T15:44:47.007

This will work for your case. Removing the selected item from an array. It will always give you unique values.

var items = [{
  name: 'Tom',
  phone: '12321'
}, {
  name: 'Jerry',
  phone: '235677'
}, {
  name: 'Mike',
  phone: '11209765'
}, {
  name: 'Robert',
  phone: '5345'
}, {
  name: 'Danny',
  phone: '1247774'
}, {
  name: 'Josef',
  phone: '1199900'
}, {
  name: 'Rainbow',
  phone: '12675'
}, {
  name: 'Avi',
  phone: '12344'
}, {
  name: 'Shani',
  phone: '12222767'
}];

function getRandom(items) {

  let names = [];
  let first = Math.floor(Math.random() * items.length);
  names.push(items[first].name);
  items.splice(first, 1);
  let second = Math.floor(Math.random() * items.length);
  names.push(items[second].name);
  items.splice(second, 1);
  let third = Math.floor(Math.random() * items.length);
  names.push(items[third].name);
  return names;
}

console.log(getRandom([...items]));

Using `3` to calculate index means you won't ever see any of the items past first 5 or 6 in the array. The calculations should be based on total length. Could also DRY out this code into a simple loop without all the repetition — charlietfl, Aug 15 '20 at 15:29

JavaScript get 3 unique random object from array

1 Answers1