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 相关文章推荐
用 Javascript 验证表单(form)中的单选(radio)值
Sep 08 Javascript
FF火狐下获取一个元素同类型的相邻元素实现代码
Dec 15 Javascript
js中settimeout方法加参数的使用实例
Feb 27 Javascript
JavaScript生成验证码并实现验证功能
Sep 24 Javascript
JavaScript 身份证号有效验证详解及实例代码
Oct 20 Javascript
JavaScript实现按键精灵的原理分析
Feb 21 Javascript
基于pako.js实现gzip的压缩和解压功能示例
Jun 13 Javascript
基于vue的验证码组件的示例代码
Jan 22 Javascript
通过js给网页加上水印背景实例
Jun 17 Javascript
JavaScript基础之this和箭头函数详析
Sep 05 Javascript
Layui表格监听行单双击事件讲解
Nov 14 Javascript
JavaScript文档加载模式以及元素获取
Jul 28 Javascript
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
PHP 源代码压缩小工具
2009/12/22 PHP
php输出表格的实现代码(修正版)
2010/12/29 PHP
新浪SAE云平台下使用codeigniter的数据库配置
2014/06/12 PHP
php单态设计模式(单例模式)实例
2014/11/18 PHP
php对关联数组循环遍历的实现方法
2015/03/13 PHP
PHP实现的迷你漂流瓶
2015/07/29 PHP
php中foreach结合curl实现多线程的方法分析
2016/09/22 PHP
php变量与JS变量实现不通过跳转直接交互的方法
2017/08/25 PHP
datePicker——日期选择控件(with jquery)
2007/02/20 Javascript
THREE.JS入门教程(6)创建自己的全景图实现步骤
2013/01/25 Javascript
屏蔽IE弹出"您查看的网页正在试图关闭窗口,是否关闭此窗口"的方法
2013/12/31 Javascript
jquery实现当滑动到一定位置时固定效果
2014/06/17 Javascript
JavaScript定义类和对象的方法
2014/11/26 Javascript
js实现无限级树形导航列表效果代码
2015/09/23 Javascript
基于JS快速实现导航下拉菜单动画效果附源码下载
2016/10/27 Javascript
JavaScript日期对象(Date)基本用法示例
2017/01/18 Javascript
用Axios Element实现全局的请求loading的方法
2018/03/15 Javascript
解决vue-router在同一个路由下切换,取不到变化的路由参数问题
2018/09/01 Javascript
jQuery选择器之基本过滤选择器用法实例分析
2019/02/19 jQuery
vue中使用[provide/inject]实现页面reload的方法
2019/09/30 Javascript
解决Vue在Tomcat8下部署页面不加载的问题
2019/11/12 Javascript
Python使用gRPC传输协议教程
2018/10/16 Python
python 获取键盘输入,同时有超时的功能示例
2018/11/13 Python
Python如何实现小程序 无限求和平均
2020/02/18 Python
CSS3 RGBA色彩模式使用实例讲解
2016/04/26 HTML / CSS
html+js 实现markdown编辑器效果
2019/10/23 HTML / CSS
法国滑雪假期的专家:Ski Planet
2019/11/02 全球购物
设置器与访问器的定义以及各自特点
2016/01/08 面试题
自考毕业自我鉴定范文
2013/10/27 职场文书
20年同学聚会感言
2014/02/03 职场文书
《理想》教学反思
2014/02/17 职场文书
年终晚会主持词
2014/03/25 职场文书
2014年医药代表工作总结
2014/11/22 职场文书
大学生求职自荐信
2015/03/24 职场文书
关于艺术节的开幕致辞
2016/03/04 职场文书
企业转让协议书(范文2篇)
2019/08/15 职场文书