随机留言的实现

问题背景

对于一个给定的数组,如何随机获得它的元素

解决方案

随机获取数组一个元素

language 复制代码
var items = ['1','2','4','5','6','7','8','9','10'];
var item = items[Math.floor(Math.random()*items.length)];

解释:

Math.random()返回0到1之间的一个伪随机数,可能等于0,但是一定小于1

Math.floor方法返回小于参数值的最大整数(地板值)

结合起来:

随机获取一个0-1之间的小数, 然后乘以自身长度, 一定是一个大于等于0 小于自身长度的一个数. 如上面 长度为10, 则获取的一个随机数就为0-10之间的一个数[数组的下标].

最后根据下标获取数组元素值即可

随机获取几个元素

javascript 复制代码
function getRandomArrayElements(arr, count) {
    var shuffled = arr.slice(0), i = arr.length, min = i - count, temp, index;  //只是声明变量的方式, 也可以分开写
    while (i-- > min) {
        //console.log(i);
        index = Math.floor((i + 1) * Math.random()); //这里的+1 是因为上面i--的操作  所以要加回来
        temp = shuffled[index];  //即值交换
        shuffled[index] = shuffled[i]; 
        shuffled[i] = temp;
        //console.log(shuffled);
    }
    return shuffled.slice(min);
}


var items = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10'];
console.log( getRandomArrayElements(items, 4) );

随机一个留言

javascript 复制代码
<script>
  export default{
    data () {
      return {
        redEnvelope: {
          rewardMessage: '乐知乐享,同心共济',
          rewardNum: null,
          rewardPoint: null
        },
      }
    },
    methods: {
      randomMessage(){
        let _message = this.redEnvelope.rewardMessage //默认显示乐知乐享,同心共济
        let messageList = ['乐知乐享,同心共济', '大吉大利,永不宕机', '一起分享,共同学习', '节日快乐', '欢迎来到墨天轮']
        let _newMessage = messageList[Math.floor((Math.random()*messageList.length))]
        if(_message == _newMessage) _newMessage = messageList[Math.floor((Math.random()*messageList.length))] //如果随机的留言和上次的一样,再次随机一个留言
        this.redEnvelope.message = _newMessage
      },
    }
  }
</script>
相关推荐
橙*^O^*安20 分钟前
Go 语言基础:变量与常量
运维·开发语言·后端·golang·kubernetes
NiKo_W23 分钟前
Linux 文件系统与基础指令
linux·开发语言·指令
工程师小星星29 分钟前
Golang语言的文件组织方式
开发语言·后端·golang
乂爻yiyao29 分钟前
java 代理模式实现
java·开发语言·代理模式
博客zhu虎康1 小时前
React Hooks 报错?一招解决useState问题
前端·javascript·react.js
张子夜 iiii1 小时前
实战项目-----Python+OpenCV 实现对视频的椒盐噪声注入与实时平滑还原”
开发语言·python·opencv·计算机视觉
灰海1 小时前
vue中通过heatmap.js实现热力图(多个热力点)热区展示(带鼠标移入弹窗)
前端·javascript·vue.js·heatmap·heatmapjs
2301_770373731 小时前
Java集合
java·开发语言
啊?啊?2 小时前
18 从对象内存到函数调用:C++ 虚函数表原理(继承覆盖 / 动态绑定)+ 多态实战
开发语言·c++·多态原理
bkspiderx2 小时前
C++标准库:文件流类
开发语言·c++