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


Posted in Javascript onAugust 02, 2016

假如有一个数组是这样子:

var arr1 = ["a", "b", "c", "d"];

如何随机打乱数组顺序,也即洗牌。

有一个比较广为传播的简单随机算法:

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

实际证明上面这个并不完全随机。

随便一搜网上太多这种东西了,看一下stackoverflow上的一个高分回答,答案出自github上。

knuth-shuffle
The Fisher-Yates (aka Knuth) shuffle for Browser and Node.JS

下面一起看看上面说的这个算法,代码如下:

/*jshint -W054 */
(function (exports) {
'use strict';
// http://stackoverflow.com/questions/2450954/how-to-randomize-shuffle-a-javascript-array
function shuffle(array) {
var currentIndex = array.length
, temporaryValue
, randomIndex
;
// While there remain elements to shuffle...
while (0 !== currentIndex) {
// Pick a remaining element...
randomIndex = Math.floor(Math.random() * currentIndex);
currentIndex -= 1;
// And swap it with the current element.
temporaryValue = array[currentIndex];
array[currentIndex] = array[randomIndex];
array[randomIndex] = temporaryValue;
}
return array;
}
exports.knuthShuffle = shuffle;
}('undefined' !== typeof exports && exports || 'undefined' !== typeof window && window || global));

作者推荐使用浏览器写法:

(function () {
'use strict';
var a = [2,11,37,42]
, b
;
// The shuffle modifies the original array
// calling a.slice(0) creates a copy, which is assigned to b
b = window.knuthShuffle(a.slice(0));
console.log(b);
}());

Nodejs:

npm install -S knuth-shuffle
(function () {
'use strict';
var shuffle = require('knuth-shuffle').knuthShuffle
, a = [2,11,37,42]
, b
;
// The shuffle modifies the original array
// calling a.slice(0) creates a copy, which is assigned to b
b = shuffle(a.slice(0));
console.log(b);
}());

还有其它从这个算法中变形去的,比如下面这个for循环的。其它的就不说了。

/**
* Randomize array element order in-place.
* Using Durstenfeld shuffle algorithm.
*/
function shuffleArray(array) {
for (var i = array.length - 1; i > 0; i--) {
var j = Math.floor(Math.random() * (i + 1));
var temp = array[i];
array[i] = array[j];
array[j] = temp;
}
return array;
}

使用ES2015(ES6)

Array.prototype.shuffle = function() {
let m = this.length, i;
while (m) {
i = (Math.random() * m--) >>> 0;
[this[m], this[i]] = [this[i], this[m]]
}
return this;
}

使用:

[1, 2, 3, 4, 5, 6, 7].shuffle();

发现中文搜索随机算法一大堆,但究竟是不是完全随机,效率和兼容性都有待考究,建议后面如果有需要用到随机打乱数组元素,可以用上面这个。

Javascript 相关文章推荐
javascript下数值型比较难点说明
Jun 07 Javascript
兼容IE与firefox火狐的回车事件(js与jquery)
Oct 20 Javascript
javascript监听鼠标滚轮事件浅析
Jun 05 Javascript
JS中如何判断传过来的JSON数据中是否存在某字段
Aug 18 Javascript
JSON遍历方式实例总结
Dec 07 Javascript
深入理解jQuery事件绑定
Jun 02 Javascript
js字符串操作总结(必看篇)
Nov 22 Javascript
Node.js中DNS模块学习总结
Feb 28 Javascript
使用vue-cli(vue脚手架)快速搭建项目的方法
May 21 Javascript
微信小程序实现手指触摸画板
Jul 09 Javascript
详解VSCode配置启动Vue项目
May 14 Javascript
ElementUI之Message功能拓展详解
Oct 18 Javascript
AngularJS基础 ng-mouseleave 指令详解
Aug 02 #Javascript
js数组常用操作方法小结(增加,删除,合并,分割等)
Aug 02 #Javascript
实现React单页应用的方法详解
Aug 02 #Javascript
AngularJS基础 ng-mouseenter 指令示例代码
Aug 02 #Javascript
使用JavaScript判断手机浏览器是横屏还是竖屏问题
Aug 02 #Javascript
AngularJS ng-mousedown 指令
Aug 02 #Javascript
JS从数组中随机取出几个数组元素的方法
Aug 02 #Javascript
You might like
编写PHP的安全策略
2006/10/09 PHP
PHP 实例化类的一点摘记
2008/03/23 PHP
PHP获取网卡地址的代码
2008/04/09 PHP
PHP Mysql编程之高级技巧
2008/08/27 PHP
PHP删除非空目录的函数代码小结
2013/02/28 PHP
PHP error_log()将错误信息写入一个文件(定义和用法)
2013/10/25 PHP
smarty模板引擎之分配数据类型
2015/03/30 PHP
PHP读取文件内容的五种方式
2015/12/28 PHP
PHP引用的调用方法分析
2016/04/25 PHP
图文详解PHP环境搭建教程
2016/07/16 PHP
JQuery从头学起第三讲
2010/07/06 Javascript
分享20款好玩的jQuery游戏
2011/04/17 Javascript
javascript 用函数语句和表达式定义函数的区别详解
2014/01/06 Javascript
微信小程序 Audio API详解及实例代码
2016/09/30 Javascript
jQuery web 组件 后台日历价格、库存设置的代码
2016/10/14 Javascript
vue.js开发环境安装教程
2017/03/17 Javascript
微信小程序之页面拦截器的示例代码
2017/09/07 Javascript
jQuery实现用户信息表格的添加和删除功能
2017/09/12 jQuery
[49:20]VG vs TNC Supermajor小组赛B组败者组决赛 BO3 第二场 6.2
2018/06/03 DOTA
Python面向对象编程中的类和对象学习教程
2015/03/30 Python
Python 3.x 新特性及10大变化
2015/06/12 Python
Python中的字符串查找操作方法总结
2016/06/27 Python
Python多线程正确用法实例解析
2020/05/30 Python
解决canvas转base64/jpeg时透明区域变成黑色背景的方法
2016/10/23 HTML / CSS
香港唯港荟酒店预订:Hotel ICON
2018/03/27 全球购物
化石印度尼西亚在线商店:Fossil Indonesia
2019/03/11 全球购物
英国最大的在线时尚眼镜店:Eyewearbrands
2019/03/12 全球购物
就业协议书的作用
2014/04/11 职场文书
入党综合考察材料
2014/06/02 职场文书
2015年房产经纪人工作总结
2015/05/15 职场文书
忠犬八公的故事观后感
2015/06/05 职场文书
团干部培训班心得体会
2016/01/06 职场文书
写给汽车4S店的创业计划书,拿来即用!
2019/08/09 职场文书
那些美到让人窒息的诗句,值得你收藏!
2019/08/20 职场文书
创业分两种人:那么哪些适合创业?,哪些适合不适合创业呢?
2019/08/23 职场文书
如何理解PHP核心特性命名空间
2021/05/28 PHP