JS中数组随机排序实现(原地算法sort/shuffle算法)
创始人
2024-02-17 12:59:49
0

🐱个人主页:不叫猫先生
🙋‍♂️作者简介:专注于前端领域各种技术,热衷分享,期待你的关注。
💫系列专栏:vue3从入门到精通
📝个人签名:不破不立

目录

  • 一、原地算法
  • 二、Array.property.sort()
    • 1、方法一(不推荐)
    • 2、方法一改良
  • 三、洗牌算法实现随机排序
    • 1、换牌
    • 2、抽牌
  • 附:本文用到的JS基础

一、原地算法

在谈sort之前,我们先了解一下原地算法,什么事原地算法呢?所谓原地算法就是说基于原有的数据结构进行一定的操作修改,而不借助额外的空间。使用原地算法时,其内存干净,空间复杂度是O(1),可以减少没必要的内存,避免造成内存浪费和冗余。当然,减小内存损耗会带来算法复杂度和时间消耗的增加,所以是一个Tradeoff。Tradeoff 是一种针对目标选择有效的路径的思维方式,需要对做的事情权衡利弊,选择最佳方式处理问题。

二、Array.property.sort()

含义:sort方法基于原地算法实现数组排序,直接对数据进行排序
参数:sort(compare(a,b)),指定顺序对数组进行排序,不写参数的时候,默认会将原数据转换成字符串按照字符的Unicode编码进行排序。

compare(a,b)中,a、b都是比较参数,当
a-b>0 ,交换位置
a-b=0,位置不变
a-b<0,位置不变

随机排序我们都会想到Math的random方法,具体实现如下,但是这样操作确有缺陷,理论很丰满,实践很残酷。

1、方法一(不推荐)

arr.sort(() => Math.random() - 0.5)
  • 缺陷:chrome浏览器对于数组长度为10以内的使用插入排序,反之则为快速排序和插入排序的组合,故而并不能做到随机分布。
  • 测试:测试某数据在数组中各个位置的次数。
        let obj = {};let count = 0;let n = 10000;while (n--) {let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10,11,12,13,14]arr.sort(() => Math.random() - 0.5)let index = arr.indexOf(1)//取1在数组排序后的位置obj[index] ? obj[index]++ : obj[index] = 1}
  • 输出:
    在这里插入图片描述
  • 图示:
    在这里插入图片描述

ECMAScript中关于Array.prototype.sort(comparefn)的标准,其中并没有规定具体的实现算法,但是提到一点: Calling comparefn(a,b) always returns the same value v when given a specific pair of values a and b as its two arguments.也就是说,对同一组a、b的值,comparefn(a, b)需要总是返回相同的值。而上面的() => Math.random() -0.5(即(a, b) => Math.random() - 0.5)显然不满足这个条件。 翻看v8引擎数组部分的源码,注意到它出于对性能的考虑,对短数组(例如长度小于10)使用的是插入排序,对长数组则使用了快速排序。

理解:(a, b) => Math.random() - 0.5,每次a,b都是固定的,但是Math.random() - 0.5)却是随机的,

2、方法一改良

构造一个新数组,如[{v:1,k:Math.random()},{v:1,k:Math.random()}],具体如下:

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10,11,12,13,14]
for(let i=0;ishuffle(arr)
}
function shuffle(arr){let newArr = arr.map(item=>({v:i,k:Math.random())})newArr.sort((a,b)=> (a.k - b.k))arr.splice(0, arr.length, ...newArr.map(i => i.v));
}

三、洗牌算法实现随机排序

1、换牌

逻辑:从一副牌中抽取一张,与最后一张牌进行交换,放到最后证明该牌已经被随机抽选过,而被交换的牌就排在前面,就有机会被继续抽选。

  • 随机抽取一张
  • 抽取的放置到最后位置
  • 最后位置的牌放置在随机抽取的位置
let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10,11,12,13,14];
funtion shuffle(ar){for(let i = arr.length;i>0;i--){let temRandom =  Math.floor(Math.random()*i)arr[i] = arr[temRandom];arr[temRandom] = arr[i]}return arr
}
shuffle(arr)

2、抽牌

逻辑:从一副牌抽取一张放置一旁,则这幅牌会越抽越少,直至到最后一张。

  • 随机抽取一张
  • 抽取的牌放置旁边
  • 在抽取的那副牌冲除去随机抽取的那张牌
let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10,11,12,13,14];
funtion shuffle(ar){let temp = [];for(let i = arr.length;i>0;i--){let temRandom =  Math.floor(Math.random()*i)temp.push(arr[temRandom])arr.splice(temRandom,1)//抽取一张后,要除去这张牌,然后在剩下的牌中继续抽}return temp
}
shuffle(arr)

附:本文用到的JS基础

本文用到数组方法基本介绍

  • splice返回被删除的元素,直接修改数组数据,可接受1/2/3个参数
let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10,11,12,13,14];
arr.splice(0)//删除索引从0开始的所有数据,即删除所有数据
arr.splice(0)//删除索引从1开始的所有数据,即只保留第一位数据
arr.splice(2,1)//删除索引为2的数据
arr.splice(0,arr.length,5)//删除原数组的数据,并把数据5填充到arr中
  • Math.floor() 向下取整
  • Math.ceil() 向上取整

相关内容

热门资讯

《全民阅读促进条例》将施行,多... 一纸条例,用法治护航全民阅读;满城书香,焕发青春中国活力。近日,《全民阅读促进条例》(以下简称《条例...
原创 戴... 最近,关于前国脚戴琳的欠薪丑闻无疑是引发了球迷的持续关注,从10月25日,媒体人李平康率先爆料,晒出...
思想政治工作条例最新修订内容,... 思想政治工作条例最新修订内容,思想政治工作条例全文下载 思想政治工作条例最新修订,全文下载与深度解读...
CBA潜力赛为何打成“老将赛”... 计时钟归零,双方教练握手致意,观众开始退场,CBA联赛的正赛宣告结束。然而球场并未就此沉寂,替补席上...
“手术钻头断裂遗留患者体内”,... 12月21日,湖南祁阳市卫生健康局发布情况通报称,近日,有媒体报道祁阳市中医医院发生骨科手术钻头断裂...
代驾纠纷 代驾时撞伤行人、车辆发生故障…… 这些都和车主无关,应由代驾赔偿? 观点: 使用代驾服务并非将所有...
公司股东与妻子分居期间出轨女下... 近日据报道,宁夏永宁县人民法院一审查明公司股东李某乙在与妻子李某甲分居期间,与公司女员工马某某存在不...
动物学家、律师和创作者,Thi... 12月21日,以“一起·了不起”为主题的2025 ThinkPad黑FUN礼在京举办。活动现场,律师...
徐奇渊:扩内需与对外政策紧密相... 近日,中国海关总署发布了一组数据令人关注:2025年前11个月,我国货物贸易顺差达到1.08万亿美元...