js 生成随机数组或者叫做洗牌算法

我们假设有一个颜色数组是这样的

var arr = ["red", "green", "blue", "yellow", "brown", "violet"]。如果将其顺序打乱，生成一个随机的数组。

这该如何做呢？

1.一种直观的做法就是，随机生成一个[0, arr.lebgth-1] 区间的随机数

然后弹出(splice)一个数据，继续生成.逐渐迭代即可 。这种方法最耗时

function randomArray(arr) {var arr = arr.slice();   // 返回一个副本，不改变原数组，为了测试方便，添加的。其实可以不需要var temp_result = [];var num;while(arr.length != 0) {num = Math.round(0 + (arr.length-1 -0)* Math.random());if(temp_result.indexOf(arr[num]) == -1) {temp_result.push(arr[num]);}arr.splice(num, 1);}return temp_result;}

2.另外附加一种更为简单的操作，运行时间排在第二位。

function anotherRandomArray(arr) {var arr = arr.slice();return arr.sort(function (left, right) {return Math.random() > 0.5? -1 : 1;});}

有人说上面这种写法，达不到随机的目的，其实这种认识是不正确的，下面我们会写一个测试函数来看一下是否符合平均分布。

3. 性能最好的交换数据

function shuffleArray(arr) {var arr = arr.slice();var len = arr.length;var temp, random_index;while(len != 0) {random_index = Math.round( 0 + (len-1-0) * Math.random());temp = arr[random_index];arr[random_index] = arr[len-1];arr[len-1] = temp;--len;}return arr;}

给出一种测试函数。

function testRandom(color_arr, specific_color, func_name,count) {/*@color_arr: 颜色数组@specifi_color: 某种特定的yanse@func_name: 使用哪个洗牌函数@count: 运行多少次*/var start_time = new Date();var result = {};for(var i=0; i<count; ++i) {var color_arr = func_name(color_arr);var index = color_arr.indexOf(specific_color);if(index in result) {result[index]++;}else {result[index] = 1;}} console.log(new Date() - start_time);return result;}var color_arr = ["red", "green", "blue", "yellow", "brown", "violet"];console.log(testRandom(color_arr, "green", randomArray,100000));console.log(testRandom(color_arr, "green", anotherRandomArray,100000));console.log(testRandom(color_arr, "green", shuffleArray,100000));

测试10W次的结果如下：

180ms  77ms  42ms
 {0: 16807, 1: 16518, 2: 16867, 3: 16550, 4: 16654, 5: 16604}
 {0: 16890, 1: 16536, 2: 16871, 3: 16847, 4: 16385, 5: 16471}
 {0: 16586, 1: 16635, 2: 16597, 3: 16718, 4: 16764, 5: 16700}

很明显第三种洗牌算法是最优的，而且使用sort函数来洗牌也是可以达到平均分布的。

参考文章如下：

随机打乱数组顺序之随机洗牌算法

关于js数组元素打乱的简单思考