JavaScript中实现最高效的数组乱序方法


Posted in Javascript onOctober 11, 2014

数组乱序的意思是,把数组内的所有元素排列顺序打乱。

常用的办法是给数组原生的sort方法传入一个函数,此函数随机返回1或-1,达到随机排列数组元素的目的。

arr.sort(function(a,b){ return Math.random()>.5 ? -1 : 1;});

这种方法虽直观,但效率并不高,经我测试,打乱10000个元素的数组,所用时间大概在35ms上下(firefox)

本人一直具有打破沙锅问到底的优良品质,于是搜索到了一个高效的方法。原文见此

if (!Array.prototype.shuffle) {

    Array.prototype.shuffle = function() {

        for(var j, x, i = this.length; i; j = parseInt(Math.random() * i), x = this[--i], this[i] = this[j], this[j] = x);

        return this;

    };

}

arr.shuffle();

此方法是为Array.prototype添加了一个函数,叫shuffle——不过叫什么名字不重要啦,重要的是他的效率。

拿我上面那个10000个元素的数组来测试,用这个方法乱序完成仅需要7,8毫秒的时间。

把数组元素增加10倍到100000来测试,第一种sort方法费时500+ms左右,shuffle方法费时40ms左右,差别是大大的。

完整测试代码:

var count = 100000,arr = [];

for(var i=0;i.5 ? -1 : 1;});

Array.prototype.sort.call(arr,function(a,b){ return Math.random()>.5 ? -1 : 1;});

document.write(arr+'

');

var t1 = new Date().getTime();

document.write(t1-t);
//以下方法效率最高

if (!Array.prototype.shuffle) {

    Array.prototype.shuffle = function() {

        for(var j, x, i = this.length; i; j = parseInt(Math.random() * i), x = this[--i], this[i] = this[j], this[j] = x);

        return this;

    };

}

var t = new Date().getTime();

arr.shuffle();

document.write('

'+arr+'

');

var t1 = new Date().getTime();

document.write(t1-t);

另外,大家有没有注意到shuffle代码里的for循环,他没有后半截!也就是只有for(..)却没有后面的{..},居然可以这样写!而且居然正常执行!好奇特,我得去博客园问问。

Javascript 相关文章推荐
jQuery对象和Javascript对象之间转换的实例代码
Mar 20 Javascript
JS实现方向键切换输入框焦点的方法
Aug 19 Javascript
jquery+CSS3实现淘宝移动网页菜单效果
Aug 31 Javascript
详解Bootstrap glyphicons字体图标
Jan 04 Javascript
jQuery CSS3自定义美化Checkbox实现代码
May 12 Javascript
最棒的Angular2表格控件
Aug 10 Javascript
vue2 前后端分离项目ajax跨域session问题解决方法
Apr 27 Javascript
JavaScript异步上传图片文件的实例代码
Jul 04 Javascript
vue下跨域设置的相关介绍
Aug 26 Javascript
layui 设置table 行的高度方法
Aug 17 Javascript
用VueJS写一个Chrome浏览器插件的实现方法
Feb 27 Javascript
vue route新窗口跳转页面并且携带与接收参数
Apr 10 Vue.js
JavaScript中实现PHP的打乱数组函数shuffle实例
Oct 11 #Javascript
JavaScript定义变量和变量优先级问题探讨
Oct 11 #Javascript
JavaScript中获取鼠标位置相关属性总结
Oct 11 #Javascript
JavaScript中最简洁的编码html字符串的方法
Oct 11 #Javascript
原生Javascript封装的一个AJAX函数分享
Oct 11 #Javascript
探讨js字符串数组拼接的性能问题
Oct 11 #Javascript
分享20款美化网站的 jQuery Lightbox 灯箱插件
Oct 10 #Javascript
You might like
在Windows系统上安装PHP运行环境文字教程
2010/07/19 PHP
Mysql数据库操作类( 1127版,提供源码下载 )
2010/12/02 PHP
php实现简单文件下载的方法
2015/01/30 PHP
PHP访问Google Search API的方法
2015/03/05 PHP
文字幻灯片
2006/06/26 Javascript
由prototype_1.3.1进入javascript殿堂-类的初探
2006/11/06 Javascript
Javascript 二维数组
2009/11/26 Javascript
jQuery获取文本节点之 text()/val()/html() 方法区别
2011/03/01 Javascript
jquery load事件(callback/data)使用方法及注意事项
2013/02/06 Javascript
JS获取后台Cookies值的小例子
2013/03/04 Javascript
纯js简单日历实现代码
2013/10/05 Javascript
关于延迟加载JavaScript
2015/05/05 Javascript
原生js实现数字字母混合验证码的简单实例
2015/12/10 Javascript
关于微信中a链接无法跳转问题
2016/08/02 Javascript
requirejs按需加载angularjs文件实例
2017/06/08 Javascript
js 原生判断内容区域是否滚动到底部的实例代码
2017/11/15 Javascript
vue2.0学习之axios的封装与vuex介绍
2018/05/28 Javascript
在layui中layer弹出层点击事件无效的解决方法
2019/09/05 Javascript
Electron整合React使用搭建开发环境的步骤详解
2020/06/07 Javascript
vue-i18n实现中英文切换的方法
2020/07/06 Javascript
vue配置多代理服务接口地址操作
2020/09/08 Javascript
python选取特定列 pandas iloc,loc,icol的使用详解(列切片及行切片)
2019/08/06 Python
Python面向对象之继承原理与用法案例分析
2019/12/31 Python
Python单元测试模块doctest的具体使用
2020/02/10 Python
Python远程linux执行命令实现
2020/11/11 Python
python实现按日期归档文件
2021/01/30 Python
Pycharm创建python文件自动添加日期作者等信息(步骤详解)
2021/02/03 Python
机电专业大学生求职信
2013/10/04 职场文书
幼儿园大班新学期寄语
2014/01/18 职场文书
大学生村官座谈会发言材料
2014/05/25 职场文书
出租车拒载检讨书
2015/01/28 职场文书
排球赛新闻稿
2015/07/17 职场文书
运动会报道稿大全
2015/07/23 职场文书
大学学生会主席竞选稿怎么写?
2019/08/19 职场文书
MySQL之DML语言
2021/04/05 MySQL
vue+elementUI实现表格列的显示与隐藏
2022/04/13 Vue.js