JS随机操作数组元素

假如做一个列表页，一共有N个条目，每个条目里需要 URL，Name，Description，Image等属性，每次打开页面都要随机排序，则处理办法就是把这N条项目的所有属性存成一个JS数组，每次随机从数组里取出一个元素放到新的数组里，同时删除原数组里取出的数组元素，但是原数组的元素被删除了，所以建议创建一个临时数组，把原数组的所有元素都添加到临时数组里，然后每次随机都在临时数组里，其实吧，我试了一下，即使没有临时数组，只在原数组里操作也没问题。

JS的随机：

Math.random(); 结果为0-1间的一个随机数(包括0,不包括1) 

Math.round(num); 参数num为一个数值，函数结果为num四舍五入后的整数。

用Math.round(Math.random());可均衡获取0到1的随机整数。
用Math.round(Math.random()*10);时，可基本均衡获取0到10的随机整数，其中获取最小值0和最大值10的几率少一半。

Math.floor(num); 参数num为一个数值，函数结果为num的整数部分。9.7>9

用Math.floor(Math.random()*10);时，可均衡获取0到9的随机整数。

Math.ceil(n); 返回大于等于n的最小整数。9.7>10

用Math.ceil(Math.random()*10);时，主要获取1到10的随机整数，取0的几率极小。

 

JS操作数组：

1、数组的创建：

var arrayObj = new Array();

var arrayObj = new Array(5); 长度虽然是5，但是可变

var arrayObj = new Array([5,4,2,[6,7]]);长度是1，alert(a[0][3]);结果是6,7

 

2、数组的添加：

arrayObj.push(10, 12,[13,25]);// 将一个或多个新元素添加到数组结尾，并返回数组新长度，该例子说明新增了3个元素到末尾

arrayObj.unshift(10, 12,[13,25]);// 将一个或多个新元素添加到数组开始，数组中的元素自动后移，返回数组新长度

arrayObj.splice(开始位置,删除个数,插入的新元素);//在指定位置删除指定数量的元素后，将一个或多个新元素插入到数组的指定位置，插入位置的元素自动后移。

 

3、数组元素的删除：

arrayObj.pop(); //移除最后一个元素并返回该元素值

arrayObj.shift(); //移除最前一个元素并返回该元素值，数组中元素自动前移

arrayObj.splice(deletePos,deleteCount); //删除从指定位置deletePos开始的指定数量deleteCount的元素，数组形式返回所移除的元素

注意：无论是元素的添加还是删除，[，[,]]只算一个元素，长度只加1，另外，注意添加或者删除后返回的结果，如果需要对结果操作就把结果赋值给变量，不需要的话，就直接操作了数组。

下面看实例：

<script type="text/javascript">
        var GameDataArry = [
                                        { "name": "aaa", "url": "http://aaa.com", "img": "images/3d.png", "description": "aaaa", "download": "" },
                                        { "name": "bbb", "url": "http://bbb.com", "img": "images/shuai.png", "description": "bbbb", "download": "" },
                                        { "name": "ccc", "url": "http://ccc.com", "img": "images/wang.png", "description": "bbbbbb", "download": "" },
                                        { "name": "ddd", "url": "http://ddd.com", "img": "images/yinyang.png", "description": "xxxxx", "download": "" },
                                        { "name": "eee", "url": "http://eee.com", "img": "images/qian.png", "description": "vvvvvvv", "download": "" },
                                        { "name": "fff", "url": "http://fff.com", "img": "images/chuanyue.png", "description": "tttt", "download": "" },
                                        { "name": "ggg", "url": "http://ggg.com", "img": "images/leiwang.png", "description": "hhhh", "download": "" },
                                        { "name": "hhh", "url": "http://hhh.com", "img": "images/leiwang.png", "description": "jjj: "" },
                                        { "name": "iii", "url": "http://iii.com", "img": "images/leiting.png", "description": "jjjjjjb"" },
                                        { "name": "jjj", "url": "http://jjj.com", "img": "images/leiwang.png", "description": "err", "download": "" }
        ];

        function getArrItem(arr,num) {
            var temp_array = new Array();
            for (var index in arr) {
                temp_array.push(arr[index]);
            }
            var return_array = new Array();
            for (var i = 0; i < num; i++) {
                if (temp_array.length > 0) {
                    var arrIndex = Math.floor(Math.random() * temp_array.length);
                    return_array[i] = temp_array[arrIndex];
                    temp_array.splice(arrIndex, 1);
                } else {
                    break;
                }
            }
            return return_array;
        }
        window.onload = function () {
            var text = "";
            var ul = document.getElementById("list");
            var array = getArrItem(GameDataArry,6);
            for (var i = 0; i < array.length; i++) {
                var str = "<li><a href=\"javascript:void(0);\" style=\"display:block;\" >";
                str += "<div class=\"icon\"><img src=\"" + array[i].img + "\" /></div>";
                str += "<div class=\"info\"><div class=\"font\"><strong>" + array[i].name + "</strong><p><span class=\"start\"><img src=\"http://r.itiexue.net/wap/tiexue/game/images/start.png\" /></span>";
                str += "<span></span></p><p><span>" + array[i].description + "</span></p></div><div class=\"download\"><a href=\"" + array[i].url + "\" onclick=\"_czc.push(['_trackEvent', '" + array[i].name + "', '下载']);\">";
                str += "<img src=\"http://r.itiexue.net/wap/tiexue/game/images/download.png\" /></a></div></div></a></li>";
                text += str;
            }
            ul.innerHTML = text;                    
        };
    </script>
    <section>      
        <ul id="list">

        </ul>
    </section>