您的位置:

JS打乱数组顺序详解

一、使用Math.random()打乱数组顺序

一种简单的方法是使用Math.random()函数。代码如下:

function shuffle(arr) {
   return arr.sort(() => Math.random() - 0.5);
}

代码中的sort()方法会根据回调函数的返回值进行排序,因此在每次排序时,都会随机生成一个0到1的小数,如果小于0.5,则顺序不变,如果大于0.5,则会交换位置,达到打乱数组顺序的目的。

这种方法的缺点是无法保证完全均匀的打乱顺序,可能会出现某些元素始终在数组的固定位置上。

二、使用洗牌算法打乱数组顺序

洗牌算法也称为Fisher-Yates算法,步骤如下:

1. 从最后一个元素开始,对于每一个元素,生成一个随机数作为索引。

2. 将当前元素与随机索引位置的元素交换。

3. 重复上述步骤,直到第一个元素。

代码实现如下:

function shuffle(arr) {
    for (let i = arr.length - 1; i > 0; i--) {
        const j = Math.floor(Math.random() * (i + 1));
        [arr[i], arr[j]] = [arr[j], arr[i]];
    }
    return arr;
}

这种方案可以到达更完全的均匀打乱顺序的效果,因为每个元素的位置都有可能在每个位置。而且该算法还具有良好的时间复杂度,只需要一个for循环即可实现。

三、使用Array.sort()与随机数打乱数组顺序

在第一种方法中,我们使用sort()方法来排序数组,从而达到打乱顺序的目的。如果我们想要保留这种方法,同时又想要更好的打乱效果,可以结合随机数。代码如下:

function shuffle(arr) {
    return arr.sort(() => 0.5 - Math.random());
}

这样可以保持sort()方法的应用,同时加入随机的影响,达到更好的随机打乱效果。同样的,这种方法也存在一定的不足,即尽管概率较小,但是有可能产生某段顺序被打乱后满足顺序排列的情况。

四、使用ES6的解构语法打乱数组顺序

在ES6中,我们可以使用解构语法很方便地打乱数组顺序。代码如下:

function shuffle(arr) {
  let newArr = [...arr];
  for (let i = newArr.length - 1; i > 0; i--) {
    const j = Math.floor(Math.random() * (i + 1));
    [newArr[i], newArr[j]] = [newArr[j], newArr[i]];
  }
  return newArr;
}

使用ES6的解构语法可以更优雅地打乱数组顺序,同时也可以保持完全随机的打乱顺序。

五、使用Durstenfeld洗牌算法打乱数组顺序

在Fisher-Yates算法中,要实现对数组的打乱需要从后向前扫描数组,这意味着算法使用了随机访问(Random Access),因此效率不高。提高效率的一个传统方法是随机交换算法,即Durstenfeld洗牌算法。Durstenfeld洗牌算法是一种优化、更简单的Fisher-Yates洗牌算法。

代码实现如下:

function shuffle(arr) {
    for (let i = arr.length - 1; i > 0; i--) {
        const j = Math.floor(Math.random() * (i + 1));
        [arr[i], arr[j]] = [arr[j], arr[i]];
    }
    return arr;
}

该算法最大的优势就在于不需要对数组进行两次随机访问和缓存外部随机访问。

六、使用Lodash库的shuffle方法打乱数组顺序

Lodash是一个一致性、模块化、高性能的JavaScript实用工具库。该库提供了非常多的函数来帮助我们处理JavaScript中的常见问题,包括数组的随机打乱。

使用Lodash提供的shuffle方法可以很容易地实现数组顺序打乱,代码如下:

const _ = require('lodash');
const arr = [1, 2, 3, 4, 5];
const shuffledArr = _.shuffle(arr);
console.log(shuffledArr);

使用Lodash库可以非常便捷地实现打乱数组的目的,且Lodash的shuffle方法实现也是非常优秀的。

JS打乱数组顺序详解

2023-05-23
js高级程序设计笔记14(js高级程序设计笔记14页)

本文目录一览: 1、JavaScript高级程序设计 该怎么看 2、JavaScript学习笔记之数组基本操作示例 3、JS中有关sort以及return的问题 JavaScript高级程序设计 该怎

2023-12-08
打乱顺序

2023-05-11
python基础学习整理笔记,Python课堂笔记

2022-11-21
java学习笔记(java初学笔记)

2022-11-14
印象笔记记录java学习(Java成长笔记)

2022-11-12
jsp程序开发学习笔记2,jsp程序设计题库

本文目录一览: 1、《JSP&Servlet学习笔记》pdf下载在线阅读,求百度网盘云资源 2、林信良编著jsp&servlet学习笔记第2版课后答案吗 3、jsp有没有快速掌握的办法呀? 4、要学J

2023-12-08
python学习之笔记(python的笔记)

2022-11-10
htmljs编程笔记(html代码笔记)

本文目录一览: 1、html代码和JS代码有什么区别 2、如何在html中调用js函数 3、JavaScript学习笔记之数组基本操作示例 4、HTML5初学者笔记 5、《web前端笔记7》js字符—

2023-12-08
java基础知识学习笔记一,Java基础笔记

2022-11-21
发篇java复习笔记(java课程笔记)

2022-11-09
重学java笔记,java笔记总结

2022-11-23
java方法整理笔记(java总结)

2022-11-08
python学习笔记0(0基础Python)

2022-11-16
javascript简要笔记,JavaScript读书笔记

2022-11-17
我的python学习基础笔记,python自学笔记

2022-11-18
python学习笔记一之,python入门笔记

2022-11-21
乱码js代码(js弹窗乱码)

本文目录一览: 1、页面js中文乱码怎么解决 2、js中文乱码 3、js中文乱码怎么解决? 4、js中文乱码怎么解决 页面js中文乱码怎么解决 中文乱码主要是因为编码格式不同导致的。解决办法:将脚本编

2023-12-08
python笔记第九章,python第八章

2022-11-20
我的python笔记06(Python)

2022-11-14