JavaScript实现shuffle数组洗牌操作示例


Posted in Javascript onJanuary 03, 2019

本文实例讲述了JavaScript实现shuffle数组洗牌操作。分享给大家供大家参考,具体如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JavaScript shuffle数组洗牌</title>
<body>
<script>
function createArray(max) {
  const arr = [];
  for(let i = 0; i < max; i++) {
    arr.push(i);
  }
  return arr;
}
function shuffleSort(arr) {
  arr.sort(()=> {
    //返回值大于0,表示需要交换;小于等于0表示不需要交换
    return Math.random() > .5 ? -1 : 1;
  });
  return arr;
}
function shuffleSwap(arr) {
  if(arr.length == 1) return arr;
  //正向思路
//  for(let i = 0, n = arr.length; i < arr.length - 1; i++, n--) {
//    let j = i + Math.floor(Math.random() * n);
  //逆向思路
  let i = arr.length;
  while(--i > 1) {
    //Math.floor 和 parseInt 和 >>>0 和 ~~ 效果一样都是取整
    let j = Math.floor(Math.random() * (i+1));
    /*
    //原始写法
    let tmp = arr[i];
    arr[i] = arr[j];
    arr[j] = tmp;
    */
    //es6的写法
    [arr[i], arr[j]] = [arr[j], arr[i]];
  }
  return arr;
}
function wrap(fn, max) {
  const startTime = new Date().getTime();
  const arr = createArray(max);
  const result = fn(arr);
  const endTime = new Date().getTime();
  const cost = endTime - startTime;
  console.log(arr);
  console.log("cost : " + cost);
}
wrap(shuffleSort, 1000);
wrap(shuffleSwap, 1000);//试验证明这种方法比第一种效率高多了
</script>
</body>
</html>

这里使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码,可得如下运行结果:

JavaScript实现shuffle数组洗牌操作示例

更多关于JavaScript相关内容还可查看本站专题:《JavaScript数组操作技巧总结》、《JavaScript字符与字符串操作技巧总结》、《JavaScript遍历算法与技巧总结》、《JavaScript排序算法总结》、《JavaScript查找算法技巧总结》、《JavaScript数学运算用法总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript错误与调试技巧总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript 当前日期转化为中文的实现代码
May 13 Javascript
基于node.js的快速开发透明代理
Dec 25 Javascript
基于jquery的动态创建表格的插件
Apr 05 Javascript
IE浏览器中图片onload事件无效的解决方法
Apr 29 Javascript
Extjs grid panel自带滚动条失效的解决方法
Sep 11 Javascript
js使用setTimeout实现定时炸弹的方法
Apr 10 Javascript
JavaScript中用于生成随机数的Math.random()方法
Jun 15 Javascript
JS中使用apply方法通过不同数量的参数调用函数的方法
May 31 Javascript
BootStrap3使用错误记录及解决办法
Dec 22 Javascript
前端图片懒加载(lazyload)的实现方法(提高用户体验)
Aug 21 Javascript
vue 实现搜索的结果页面支持全选与取消全选功能
May 10 Javascript
VUE注册全局组件和局部组件过程解析
Oct 10 Javascript
JavaScript实现数字前补“0”的五种方法示例
Jan 03 #Javascript
35个最好用的Vue开源库(史上最全)
Jan 03 #Javascript
原生js实现移动端Touch轮播图的方法步骤
Jan 03 #Javascript
发布一款npm包帮助理解npm的使用
Jan 03 #Javascript
用node开发并发布一个cli工具的方法步骤
Jan 03 #Javascript
详解Vue基于vue-quill-editor富文本编辑器使用心得
Jan 03 #Javascript
Vue2 添加数据可视化支持的方法步骤
Jan 02 #Javascript
You might like
探讨GDFONTPATH能否被winxp下的php支持
2013/06/21 PHP
PHP session_start()问题解疑(详细介绍)
2013/07/05 PHP
PHP输出缓冲控制Output Control系列函数详解
2015/07/02 PHP
php实现文章置顶功能的方法
2016/10/20 PHP
解决PHP使用CURL发送GET请求时传递参数的问题
2019/10/11 PHP
基于javascipt-dom编程 table对象的使用
2013/04/22 Javascript
NodeJS学习笔记之MongoDB模块
2015/01/13 NodeJs
javascript中Array()数组函数详解
2015/08/23 Javascript
详解js中构造流程图的核心技术JsPlumb(2)
2015/12/08 Javascript
JavaScript 浏览器兼容性总结及常用浏览器兼容性分析
2016/03/30 Javascript
H5手机端多文件上传预览插件
2017/04/21 Javascript
Vue.js 点击按钮显示/隐藏内容的实例代码
2018/02/08 Javascript
vue如何通过id从列表页跳转到对应的详情页
2018/05/01 Javascript
vue实现条件判断动态绑定样式的方法
2018/09/29 Javascript
微信小程序顶部导航栏可滑动并选中放大
2019/12/05 Javascript
H5实现手机拍照和选择上传功能
2019/12/18 Javascript
js实现小星星游戏
2020/03/23 Javascript
夯基础之手撕javascript继承详解
2020/11/09 Javascript
[03:51]吞吞映像 每周精彩击杀top10第二弹
2014/06/25 DOTA
[44:33]EG vs Liquid 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
[01:11:46]DOTA2-DPC中国联赛 正赛 iG vs Magma BO3 第一场 2月23日
2021/03/11 DOTA
Python中列表(list)操作方法汇总
2014/08/18 Python
Python入门篇之条件、循环
2014/10/17 Python
基于python时间处理方法(详解)
2017/08/14 Python
scrapy-redis的安装部署步骤讲解
2019/02/27 Python
python绘制漏斗图步骤详解
2019/03/04 Python
python实现微信自动回复及批量添加好友功能
2019/07/03 Python
keras实现图像预处理并生成一个generator的案例
2020/06/17 Python
html5使用canvas绘制文字特效
2014/12/15 HTML / CSS
英国网上香水店:Fragrance Direct
2016/07/20 全球购物
师范应届生语文教师求职信
2013/10/29 职场文书
信电学院毕业生自荐书
2014/05/24 职场文书
纪念一二九运动演讲稿
2014/09/16 职场文书
2014年信访工作总结
2014/11/17 职场文书
民间借贷借条如何写
2015/05/26 职场文书
python获取淘宝服务器时间的代码示例
2021/04/22 Python