JavaScript generate random numbers without repeating

Question

I have some code where I have an array of x amount of items. In this case, videos, and I want to randomly call a video, however if the current video already called is the same as the random number I want it to generate another random number until it's unique.

Here's my code:

var videoLinks = [
    ['<iframe id="vid" src="https://www.youtube.com/embed/nYm2G4MnSkY?autoplay=1" frameborder="0" allowfullscreen></iframe>'],
    ['<iframe id="vid" src="https://www.youtube.com/embed/wAgZVLk6J4M?autoplay=1&start=5&end=45" frameborder="0" allowfullscreen></iframe>'],
    ['<iframe id="vid" src="https://www.youtube.com/embed/ix9wpslKwBE?autoplay=1" frameborder="0" allowfullscreen></iframe>'],
    ['<iframe id="vid" src="https://www.youtube.com/embed/OJJ-iLsQOPc?autoplay=1&iv_load_policy=3" frameborder="0" allowfullscreen></iframe>'],
    ['<iframe id="vid" src="https://www.youtube.com/embed/rore790l_sk?autoplay=1&start=12&end=94" frameborder="0" allowfullscreen></iframe>'],
];

var randomNumber = function () {
    var getRandomNumber = Math.floor(Math.random() * 5);
    var random = videoLinks[getRandomNumber]
    document.getElementById("videoWrapper").innerHTML = random[0];
};

randomNumber(); // To call the function on load

Maybe "Suffle an array" will help you ? http://stackoverflow.com/a/6274381/622813 — l2aelba, Sep 15 '15 at 13:25

score 5 · Accepted Answer · edited Sep 15 '15 at 13:37

5

use a variable to check if the number is the same.

something like this: (using LastNumber to store the lastNumber) if it allready is used we gonna try again)

var videoLinks = [
    ....
];

var lastNumber = 0;
var randomNumber = function () {
    var getRandomNumber = Math.floor(Math.random() * 5);  
    if(getRandomNumber != lastNumber){
        var random = videoLinks[getRandomNumber];
        document.getElementById("videoWrapper").innerHTML = random[0];
        lastNumber = getRandomNumber;
    }else{
        randomNumber();
    }
};

randomNumber(); // To call the function on load

edited Sep 15 '15 at 13:37

l2aelba

21,591
22
102
138

answered Sep 15 '15 at 13:26

Kasper Sanguesa-Franz

622
5
24

This was exactly what I was looking for I ust couldn't get my head around it. Thanks very much. Also you was missing a }; at the end – Karl Taylor Sep 15 '15 at 13:34

adricadar · Answer 2 · 2015-09-15T13:34:25.333

0

You can create an array to keep the exiting generated numbers.

var existingNumbers = [];
var maxNumbers = 5;
var randomNumber = function() {
  if (existingNumbers.length != maxNumbers) {
    do {
      getRandomNumber = Math.floor(Math.random() * maxNumbers);
    } while (existingNumbers.indexOf(getRandomNumber) > -1);
    existingNumbers.push(getRandomNumber);
   
    var random = videoLinks[getRandomNumber]
    document.getElementById("videoWrapper").innerHTML = random[0];
  }
};

edited Sep 15 '15 at 13:34

answered Sep 15 '15 at 13:21

adricadar

9,971
5
33
46

You forgot to set values to existingNumbers – Yabada Sep 15 '15 at 13:22

Creynders · Answer 3 · 2015-09-16T10:00:26.260

0

First of all, why do you wrap all those strings in Arrays? I dropped them in my solution below. Anyway, easiest and cleanest solution is to clone the Array, and drop the selected URL from the new Array.

var videoLinks = [
    '<iframe id="vid" src="https://www.youtube.com/embed/nYm2G4MnSkY?autoplay=1" frameborder="0" allowfullscreen></iframe>',
    '<iframe id="vid" src="https://www.youtube.com/embed/wAgZVLk6J4M?autoplay=1&start=5&end=45" frameborder="0" allowfullscreen></iframe>',
    '<iframe id="vid" src="https://www.youtube.com/embed/ix9wpslKwBE?autoplay=1" frameborder="0" allowfullscreen></iframe>',
    '<iframe id="vid" src="https://www.youtube.com/embed/OJJ-iLsQOPc?autoplay=1&iv_load_policy=3" frameborder="0" allowfullscreen></iframe>',
    '<iframe id="vid" src="https://www.youtube.com/embed/rore790l_sk?autoplay=1&start=12&end=94" frameborder="0" allowfullscreen></iframe>'
];
var temp = videoLinks.slice();

function randomVideo(){
  var r = Math.floor(Math.random()*temp.length);
  return temp.splice(r, 1);
}

edited Sep 16 '15 at 10:00

answered Sep 15 '15 at 15:01

Creynders

4,573
20
21

Not too sure what you mean, I wrapped them in the array so I could call them using randomNumber(). – Karl Taylor Sep 15 '15 at 18:52
No, I meant: why do you wrap each string in a separate array? – Creynders Sep 16 '15 at 09:01
I added the `videoLinks` without the unnecessary extra arrays to my solution. – Creynders Sep 16 '15 at 10:00
When I use a single array it only calls back a single character rather than the whole array? – Karl Taylor Sep 24 '15 at 14:44
@kot this is in code not shown in the question, right? Anyway, my randomVideo function returns a single item array, i.e. you use it just as you did: `document.getElementById("videoWrapper").innerHTML = randomVideo()[0]` – Creynders Sep 26 '15 at 07:58

score 0 · Answer 4 · answered Dec 02 '19 at 03:14

randojs.com makes this simple:

var sequence = randoSequence(videoLinks);

Then, you can loop through videoLinks to get the values in random order. Here's how you get the first random value:

sequence[0].value

When you run out, just generate a new sequence if needed.

You just need to add the following to the head of your html document, and you can do pretty much whatever you want with randomness easily. Random numbers, random values from arrays, random jquery elements, random properties from objects, and even preventing repetitions as I've shown here.

<script src="https://randojs.com/1.0.0.js"></script>

JavaScript generate random numbers without repeating

4 Answers4

Linked

Related