Computer Science Canada

Javascript: Shuffle array and preserving keys
Author:  Amailer [ Wed Nov 17, 2010 6:22 pm ]
Post subject:  Javascript: Shuffle array and preserving keys
Hello,

I am trying to figure out how to do this. I basically need to shuffle an array which I get via an ajax response (json -> javascript collection object I believe). Problem is, I also need the keys to be preserved.

So if I have the following data

0:a
1:b
2:c
3:d

after shuffling, it could be something like

1:b
3:d
2:c
0:a

How exactly do that do that? I tried passing the array data json encoded with the data already shuffled, however whenever I run through it in a loop (I used jquery's $.each() loop function, and the for() loop as well) it always orders it from lowest to highest key order.

I would rather much figure out a way to preserve the array keys when running through the array BUT I am fine with figuring out a way to shuffle it client side as well.
Author:  jcollins1991 [ Wed Nov 17, 2010 6:53 pm ]
Post subject:  Re: Javascript: Shuffle array and preserving keys
Assuming you just have an array of objects the following should work and return the objects with all the keys preserved

code:

a = [1,2,3,4,5]

a.sort(function(a,b)
{
  return 0.5 - Math.random()
})

alert(a)


Not sure why it'd un-shuffle your ajax response though, if u do something like a = exec(response) where response is just a string representing an array of objects ("[{},{},..]") theres no reason it'd do anything to your ordering...
Author:  Amailer [ Thu Nov 18, 2010 10:56 am ]
Post subject:  RE:Javascript: Shuffle array and preserving keys
That does not seem to work either; is this the proper way to loop through the rests?


code:

value = [1,2,3,4,5]
for(key in value)
{
alert(value[key])
}


If so, the keys area always ordered from 0-1 but the values are randomized (meaning, keys are not being preserved).

I'm not entirely why even though I pass the array via json "pre-shuffled" looping through the data still displays it from 0-x key order.
Author:  jcollins1991 [ Thu Nov 18, 2010 1:29 pm ]
Post subject:  Re: Javascript: Shuffle array and preserving keys
Weird, another option you could try is to create a shuffled array of indices to use in your loop. This version adds and removes stuff instead of shuffling in place like the sort (though using the sort technique on the array would also produce the same results...), I'm not really sure which is more efficient. If you could post a sample of the data you're using I could try testing to see where your problem might be...

code:

  your_array = [??????]
 
  b = []
  for (var i = 0; i < your_array.length; i += 1)
    b.push(i)

  index = 0
  while (index < b.length)
  {
    rand = Math.floor((b.length - index) * Math.random())
    b.unshift(b.splice(rand + index,1))
    index += 1
  }

  alert(b)

  for (var index in b)
  {
    // Write your code here.....
    your_array[index]
  }
Author:  Amailer [ Thu Nov 18, 2010 2:40 pm ]
Post subject:  RE:Javascript: Shuffle array and preserving keys
Its because the for() loop - sorts the array by its key (ascending).

I have an array which, when inserting the data, inserted it as so:

code:

key:8 | value: [object Object]
key:5 | value: [object Object]
key:44 | value: [object Object]
key:10 | value: [object Object]
key:1 | value: [object Object]
key:21 | value: [object Object]
key:24 | value: [object Object]
key:9 | value: [object Object]
key:37 | value: [object Object]
key:43 | value: [object Object]
key:0 | value: [object Object]
key:3 | value: [object Object]
key:23 | value: [object Object]
key:15 | value: [object Object]
key:32 | value: [object Object]
key:38 | value: [object Object]
key:6 | value: [object Object]
key:35 | value: [object Object]
key:26 | value: [object Object]
key:17 | value: [object Object]
key:22 | value: [object Object]
key:14 | value: [object Object]
key:27 | value: [object Object]
key:19 | value: [object Object]
key:41 | value: [object Object]
key:16 | value: [object Object]
key:20 | value: [object Object]
key:25 | value: [object Object]
key:2 | value: [object Object]
key:12 | value: [object Object]
key:36 | value: [object Object]
key:7 | value: [object Object]
key:11 | value: [object Object]
key:18 | value: [object Object]
key:40 | value: [object Object]
key:13 | value: [object Object]
key:42 | value: [object Object]
key:4 | value: [object Object]
key:30 | value: [object Object]
key:31 | value: [object Object]
key:39 | value: [object Object]
key:34 | value: [object Object]
key:28 | value: [object Object]
key:29 | value: [object Object]
key:33 | value: [object Object]


Then the new array that I inserted the above data, when I ran through its data using a for loop, this is how it was ordered...

Result:
code:

key:0 | value: [object Object]
key:1 | value: [object Object]
key:2 | value: [object Object]
key:3 | value: [object Object]
key:4 | value: [object Object]
key:5 | value: [object Object]
key:6 | value: [object Object]
key:7 | value: [object Object]
key:8 | value: [object Object]
key:9 | value: [object Object]
key:10 | value: [object Object]
key:11 | value: [object Object]
key:12 | value: [object Object]
key:13 | value: [object Object]
key:14 | value: [object Object]
key:15 | value: [object Object]
key:16 | value: [object Object]
key:17 | value: [object Object]
key:18 | value: [object Object]
key:19 | value: [object Object]
key:20 | value: [object Object]
key:21 | value: [object Object]
key:22 | value: [object Object]
key:23 | value: [object Object]
key:24 | value: [object Object]
key:25 | value: [object Object]
key:26 | value: [object Object]
key:27 | value: [object Object]
key:28 | value: [object Object]
key:29 | value: [object Object]
key:30 | value: [object Object]
key:31 | value: [object Object]
key:32 | value: [object Object]
key:33 | value: [object Object]
key:34 | value: [object Object]
key:35 | value: [object Object]
key:36 | value: [object Object]
key:37 | value: [object Object]
key:38 | value: [object Object]
key:39 | value: [object Object]
key:40 | value: [object Object]
key:41 | value: [object Object]
key:42 | value: [object Object]
key:43 | value: [object Object]
key:44 | value: [object Object]


So, any way to run through an array while preserving the order it was inserted into the array?

In PHP at least, the foreach() loop preserves the order the data has been inserted into the array.

EDIT: Actually I am very confused, to populate my new array with "shuffled keys/indexs" I did this:

code:

        for(var key in tmp) {
            newarray[tmp[key][0]] = tmp[key][1];
            //console.log("key:" + tmp[key][0] + " | value: " + tmp[key][1]);
        }


The console log shows that what I am doing is good, its entering the data into my new array all shuffled up. Yet when I run through my newarray variable, its all ordered from 0 - 44

Okay, so I ran this script that someone posted, and it works as intended. The order the data is entered into the array is the order you get when you loop through it.
code:

var username = {"14719":"A","648":"B","15185":"C"};

for (var i in username) {
  console.log(i + ' => ' + username[i]);
}


Result:
code:
14719 => A
648 => B
15185 => C


Which works....so what am I doing wrong?

EDIT:

Wow, on Google Chrome, the for (var i in username) { order is ascending! So changes depending on the browser; just awesome Very Happy
Author:  jcollins1991 [ Thu Nov 18, 2010 5:22 pm ]
Post subject:  Re: Javascript: Shuffle array and preserving keys
Well, in javascript arrays are the normal type of array from languages like C afaik (or something similar) so stuff is inserted in order, while in PHP since they have associative arrays I'd guess that any new elements may be added to the end (or at least in your case). I think the easiest thing for you to do is to make an array of objects ("{key:1, the rest of your object}, ...") and just use randomizing code, then just write your own type of dictionary item retrieval if you want to access anything in specific.

And about the object stuff, I remember reading (for javascript I believe) that there isn't a standard right now for the ordering of items within an object, which is why you're having the problem with things being in order or out of order in your last example.

:


You can syndicate this boards posts using the file backend.php or view the topic map using sitemap.php.

Terms of Use | Privacy Policy