Print array in random order?

Question

I'm trying to output a javascript array of 4 items in a random order. Problem is, I can only get one to print randomly, like this:

Sequence:

Diet Coke

..but I would like it to print something similar to:

Sequence:

Diet Coke

Psuedo Coke

None-psuedo Coke

Coke Zero

..in a random order, of course.

<div id="test1"></div>
<div id="test1-drinks"></div>

<script>

    var contents=new Array()
    contents[0]='Coke Zero'
    contents[1]='Diet Coke'
    contents[2]='Psuedo Coke'
    contents[3]='None-psuedo Coke'


    var i=0
    var random
    var spacing="<br>"
    while (i<contents.length){
        random=Math.floor(Math.random()*contents.length)
        document.getElementById('test1').innerHTML = "Sequence:<br>";
        if (contents[random]!="selected"){
            document.getElementById('test1-drinks').innerHTML = contents[random]+spacing;
            //mark element as selected
            contents[random]="selected"
            i++
        }
    }

</script>

I was hoping the while-loop would cover that for me, but it's not.. Any help is appreciated, and languages php, jQuery and JavaScript are all much welcome.

EDIT: Script's from here, but I don't want document.write to be used to I tried fixing it up.

@Pointy I'll give that a Google. Thing is that this script was working, till I tried to adjust it, and I can't see why it isn't working as of right now. — Algernop K.
– Algernop K., Commented May 11, 2016 at 14:22
@AlgernopK. no need to google - my comment is a link to the Wikipedia page. — Pointy
– Pointy, Commented May 11, 2016 at 14:24
I don't have any flag remaining. Could someone flag the question as the 1000th duplicate of stackoverflow.com/questions/6274339/…? — Regis Portalez
– Regis Portalez, Commented May 11, 2016 at 14:30

Nina Scholz · Accepted Answer · 2016-05-11 14:25:16Z

2

You could splice the array with a random index until the array is empty.

var contents = ['Coke Zero', 'Diet Coke', 'Psuedo Coke', 'None-psuedo Coke'];

while (contents.length) {
    document.write(contents.splice(Math.floor(Math.random() * contents.length), 1) + '<br>');
}

answered May 11, 2016 at 14:25

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

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

Comments

Glubus · Accepted Answer · 2016-05-11 14:27:15Z

1

Step 1: Define your array:

var contents=new Array()
    contents[0]='Coke Zero'
    contents[1]='Diet Coke'
    contents[2]='Psuedo Coke'
    contents[3]='None-psuedo Coke'

Step 2: Randomly order the array:

contents.sort(function() {
  return .5 - Math.random();
});

Step 3: Print the values:

$.each(contents, function(index,value) {
    document.getElementById('test1-drinks').append(value + "<br/>");
});

Your problem

You add 1 to i even after you collide with a value that was already selected, so you will not always print 4 times.
You override the data each time you print using innerHTML =. You need to allow for the old html to stay there, by using append.

answered May 11, 2016 at 14:27

Glubus

2,8651 gold badge14 silver badges27 bronze badges

3 Comments

Nina Scholz Over a year ago

i would not use sort for a single loop task.

Glubus Over a year ago

Clearly the creation of the random ordering can be implemented in a better way performance wise. However, it is not relevant to the question. OP can decide for him/herself what implementation he/she wants to use to create the random ordering, though I like this method for examples like these because of its compactness.

Glubus Over a year ago

Also, unless you were not talking about the time complexity of this solution, sorting once is less costly then splicing n times, as a single splice is O(n) complex, resulting in a O(n^2) complex solution as opposed to the O(n log n) complex sorting method. No offense taken!

Algernop K. · Accepted Answer · 2016-05-11 14:24:34Z

0

My bad. Adjusted:

document.getElementById('test1-drinks').innerHTML = contents[random]+spacing;

to

document.getElementById('test1-drinks').innerHTML += contents[random]+spacing;

so I wouldn't keep replacing the randomized order.

answered May 11, 2016 at 14:24

Algernop K.

4772 silver badges20 bronze badges

Collectives™ on Stack Overflow

Print array in random order?

3 Answers 3

Comments

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related