javascript随机之洗牌算法深入分析


Posted in Javascript onJune 07, 2014

洗牌算法是我们常见的随机问题,在玩游戏、随机排序时经常会碰到。它可以抽象成这样:得到一个M以内的所有自然数的随机顺序数组。

在百度搜“洗牌算法”,第一个结果是《百度文库-洗牌算法》,扫了一下里面的内容,很多内容都容易误导别人走上歧途,包括最后用链表代替数组,也只是一个有限的优化(链表也引入了读取效率的损失)。

该文里的第一种方法,可以简单描述成:随机抽牌,放在另一组;再次抽取,抽到空牌则重复抽。
“抽到空牌则重复抽”这会导致后面抽到空牌的机会越来越大,显然是不合理的。
可以优化一步成:牌抽走后,原牌变少。(而不是留下空牌)
代码如下:

function shuffle_pick_1(m) //洗牌 //抽牌法
{
    //生成m张牌
    var arr = new Array(m);
    for (var i=0; i<m; i++) {
        arr[i] = i;
    }
    //每次抽出一张牌,放在另一堆。因为要在数组里抽出元素,把后面的所有元素向前拉一位,所以很耗时。
    var arr2 = new Array();
    for (var i=m; i>0; i--) {
        var rnd = Math.floor(Math.random()*i);
        arr2.push(arr[rnd]);
        arr.splice(rnd,1);
    }
    return arr2;
}

这个也明显有问题,因为数组如果很大的话,删除中间的某个元素,会导致后面的排队向前走一步,这是一个很耗时的动作。
回想一下“我们为什么要删除那个元素?”目的就是为了不产生空牌。
除了删除那个元素之外,我们是不是还有其它方式来去除空牌?
----有的,我们把最后一张未抽的牌放在那个抽走的位置上就可以了。
所以,这个思路我们可以优化成这样:

function shuffle_pick(m) //洗牌 //抽牌法优化牌
{
    //生成m张牌
    var arr = new Array(m);
    for (var i=0; i<m; i++) {
        arr[i] = i;
    }
    //每次抽出一张牌,放在另一堆。把最后一张未抽的牌放在空位子上。
    var arr2 = new Array();
    for (var i=m; i>0;) {
        var rnd = Math.floor(Math.random()*i);
        arr2.push(arr[rnd]);
        arr[rnd] = arr[--i];
    }
    return arr2;
}

除了抽牌思路,我们还可以用换牌思路。
《百度文库-洗牌算法》提到一种换牌思路:“随机交换两个位置,共交换n次,n越大,越接近随机”。
这个做法是不对的,就算n很大(例如10张牌,进行10次调换),也还存在很大可能“有的牌根本没换位置”。
顺着这个思路,做一点小调整就可以了:第i张与任意一张牌换位子,换完一轮即可。
代码如下:
function shuffle_swap(m) //洗牌 //换牌法
{
    //生成m张牌
    var arr = new Array(m);
    for (var i=0; i<m; i++) {
        arr[i] = i;
    }
    //第i张与任意一张牌换位子,换完一轮即可
    for (var i=0; i<m; i++) {
        var rnd = Math.floor(Math.random()*(i+1)),
            temp = arr[rnd];
        arr[rnd] = arr[i];
        arr[i]=temp;
    }
    return arr;
}

除了抽牌与换牌的思路,我们还可以用插牌的思路:先有一张牌,第二张牌有两个位置可随机插入(第一张牌前,或后),第三张牌有三个位置可随机插入(放在后面,或插在第一位,或插在第二位),依此类推
代码如下:

function shuffle_insert_1(m) //洗牌 //插牌法
{
    //每次生成一张最大的牌,插在随机的某张牌前。因为要在数组里插入元素,把后面的所有元素向后挤一位,所以很耗时。
    var arr = [0];
    for (var i=1; i<m; i++) {
        arr.splice(Math.floor(Math.random()*(i+1)),0,i);
    }
    return arr;
}

以上的代码也会有一些问题:就是随着牌数的增多,插牌变得越来越困难,因为插牌会导致后面的很多牌都往后推一步。
当然,我们也可以适当的优化一下:先有n-1张牌,第n张牌放在最后,然后与任意一张牌互换位置。
代码如下:

function shuffle_insert(m) //洗牌 //插牌法优化版,可以用数学归纳法证明,这种洗牌是均匀的。
{
    //每次生成一张最大的牌,与随机的某张牌换位子
    var arr = new Array(m);
    arr[0] = 0;
    for (var i=1; i<m; i++) {
        var rnd = Math.floor(Math.random()*(i+1));
        arr[i] = arr[rnd];
        arr[rnd] = i;
    }
    return arr;
}

好的,全部的代码如下,有兴趣的同学可以在自己的机器上试下,看下他们各自的执行效率、以及最后的结果是否是理论随机。

 

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>JK:javascript 洗牌算法 </title>
</head>
<body>
<script type="text/javascript">
function shuffle_pick_1(m) //洗牌 //抽牌法
{
    //生成m张牌
    var arr = new Array(m);
    for (var i=0; i<m; i++) {
        arr[i] = i;
    }
    //每次抽出一张牌,放在另一堆。因为要在数组里抽出元素,把后面的所有元素向前拉一位,所以很耗时。
    var arr2 = new Array();
    for (var i=m; i>0; i--) {
        var rnd = Math.floor(Math.random()*i);
        arr2.push(arr[rnd]);
        arr.splice(rnd,1);
    }
    return arr2;
}

function shuffle_pick(m) //洗牌 //抽牌法优化牌
{
    //生成m张牌
    var arr = new Array(m);
    for (var i=0; i<m; i++) {
        arr[i] = i;
    }
    //每次抽出一张牌,放在另一堆。把最后一张未抽的牌放在空位子上。
    var arr2 = new Array();
    for (var i=m; i>0;) {
        var rnd = Math.floor(Math.random()*i);
        arr2.push(arr[rnd]);
        arr[rnd] = arr[--i];
    }
    return arr2;
}

function shuffle_swap(m) //洗牌 //换牌法
{
    //生成m张牌
    var arr = new Array(m);
    for (var i=0; i<m; i++) {
        arr[i] = i;
    }
    //第i张与任意一张牌换位子,换完一轮即可
    for (var i=0; i<m; i++) {
        var rnd = Math.floor(Math.random()*(i+1)),
            temp = arr[rnd];
        arr[rnd] = arr[i];
        arr[i]=temp;
    }
    return arr;
}
function shuffle_insert_1(m) //洗牌 //插牌法
{
    //每次生成一张最大的牌,插在随机的某张牌前。因为要在数组里插入元素,把后面的所有元素向后挤一位,所以很耗时。
    var arr = [0];
    for (var i=1; i<m; i++) {
        arr.splice(Math.floor(Math.random()*(i+1)),0,i);
    }
    return arr;
}
function shuffle_insert(m) //洗牌 //插牌法优化版,可以用数学归纳法证明,这种洗牌是均匀的。
{
    //每次生成一张最大的牌,与随机的某张牌换位子
    var arr = new Array(m);
    arr[0] = 0;
    for (var i=1; i<m; i++) {
        var rnd = Math.floor(Math.random()*(i+1));
        arr[i] = arr[rnd];
        arr[rnd] = i;
    }
    return arr;
}

//alert(shuffle_pick(10))

var funcs = [shuffle_pick_1, shuffle_pick, shuffle_swap, shuffle_insert_1, shuffle_insert],
    funcNames = ["抽牌", "抽牌优化", "换牌", "插牌", "插牌优化"]
    m = 10000,
    times=[];
for(var i = 0; i < funcs.length; i++){
    var d0= new Date();
    funcs[i](m);
    funcNames[i] = (new Date() - d0) + '\t' + funcNames[i];
}
alert(funcNames.join('\n'));
</script>

</body>
</html>
Javascript 相关文章推荐
jQuery 插件仿百度搜索框智能提示(带Value值)
Jan 22 Javascript
Extjs实现进度条的两种便捷方式
Sep 26 Javascript
js实现tab切换效果实例
Sep 16 Javascript
javascript中加var和不加var的区别 你真的懂吗
Jan 06 Javascript
JavaScript表单验证的两种实现方法
Feb 11 Javascript
Angularjs2不同组件间的通信实例代码
May 06 Javascript
JavaScript ES6中的简写语法总结与使用技巧
Dec 30 Javascript
解决vue组件props传值对象获取不到的问题
Jun 06 Javascript
angularjs1.X 重构controller 的方法小结
Aug 15 Javascript
原生js实现无缝轮播图
Jan 11 Javascript
vue中利用iscroll.js解决pc端滚动问题
Feb 15 Javascript
element中Steps步骤条和Tabs标签页关联的解决
Dec 08 Javascript
ECMAScript6的新特性箭头函数(Arrow Function)详细介绍
Jun 07 #Javascript
js中的caller和callee属性介绍和例子
Jun 07 #Javascript
javascript中拼接HTML字符串的最快、最好的方法
Jun 07 #Javascript
javascript在网页中实现读取剪贴板粘贴截图功能
Jun 07 #Javascript
JavaScript异步回调的Promise模式封装实例
Jun 07 #Javascript
jQuery的缓存机制浅析
Jun 07 #Javascript
Firefox中使用outerHTML的2种解决方法
Jun 07 #Javascript
You might like
php checkbox 取值详细说明
2010/08/19 PHP
php+mysqli使用预处理技术进行数据库查询的方法
2015/01/28 PHP
Centos下升级php5.2到php5.4全记录(编译安装)
2015/04/03 PHP
php正则preg_replace_callback函数用法实例
2015/06/01 PHP
Laravel5中防止XSS跨站攻击的方法
2016/10/10 PHP
javascript显示选择目录对话框的代码
2008/11/10 Javascript
js获取提交的字符串的字节数
2009/02/09 Javascript
动态加载script文件的两种方法
2013/08/15 Javascript
Nodejs sublime text 3安装与配置
2014/06/19 NodeJs
JS+CSS实现仿msn风格选项卡效果代码
2015/10/22 Javascript
小心!AngularJS结合RequireJS做文件合并压缩的那些坑
2016/01/09 Javascript
AngularJS在IE8的不支持的解决方法
2016/05/13 Javascript
jQuery Mobile框架中的表单组件基础使用教程
2016/05/17 Javascript
jQuery UI结合Ajax创建可定制的Web界面
2016/06/22 Javascript
jQuery使用animate实现ul列表项相互飘动效果示例
2016/09/16 Javascript
JavaScript实现时间表动态效果
2017/07/15 Javascript
React Native中TabBarIOS的简单使用方法示例
2017/10/13 Javascript
在vue中使用vue-echarts-v3的实例代码
2018/09/13 Javascript
vue 本地环境跨域请求proxyTable的方法
2018/09/19 Javascript
Vue通过getAction的finally来最大程度避免影响主数据呈现问题
2020/04/24 Javascript
Python实现telnet服务器的方法
2015/07/10 Python
python如何压缩新文件到已有ZIP文件
2018/03/14 Python
使用OpenCV实现仿射变换—平移功能
2019/08/29 Python
使用django自带的user做外键的方法
2020/11/30 Python
HTML5 对各个标签的定义与规定:body的介绍
2012/06/21 HTML / CSS
德国排名第一的主题公园门票网站:Attraction Tickets Direct
2019/09/09 全球购物
建筑文秘专业个人求职信范文
2013/12/28 职场文书
欢送退休感言
2014/02/08 职场文书
个人欠款担保书
2014/05/20 职场文书
金融保险专业求职信
2014/09/03 职场文书
普通党员群众路线教育实践活动心得体会
2014/11/04 职场文书
惊天动地观后感
2015/06/10 职场文书
反四风问题学习心得体会
2016/01/22 职场文书
Html分层的box-shadow效果的示例代码
2021/03/30 HTML / CSS
如何正确理解python装饰器
2021/06/15 Python
Python pandas求方差和标准差的方法实例
2021/08/04 Python