详谈JS中实现种子随机数及作用


Posted in Javascript onJuly 19, 2016

前言

在前端开发中,尤其是游戏开发,经常会用到随机数,那么我们会第一时间想到:Math.random,大家略微的看看如下代码:

for (var i= 0; i<10; i++) { document.writeln(Math.random() +"<br />"); }

运行如上代码,也确实生成了10个不同的数字,当然你可以生成更多,看起来挺不错的,如果仅仅如此,那么本文就没必要写了。

示例

试着想一下,如果在某一个场景,我们做一个游戏,用户玩到一半的时候退出了,这样用户下次进来可以选择继续上一次的进度继续玩,那么现在问题来了:用户玩的进度以及用户的积分等简单的描述数据,我们都可以记录下来,但是游戏里绘制的障碍物、飞行物以及很多装饰类的小玩意儿,他们甚至是每次用户点开始随机输出的,要把画布上所有的东西以及它们的大小,位置等都记录下来,实在是没必要。

于是种子随机数就闪亮登场了,我们如果在画布上元素随机绘制的时候,有一个种子值,页面上所有元素的位置、大小等都是根据这个种子来算的,那么等到第二次绘制的时候只需要传入这个种子,就可以重现之前未完成的画布元素。

那么这个时候,你会发现JS里面自带的Math.random就不好使了,无法满足需求,我们继续看这段代码:

Math.seed = 5; Math.seededRandom = function(max, min) { max = max || 1; min = min || 0; Math.seed = (Math.seed * 9301 + 49297) % 233280; var rnd = Math.seed / 233280.0; return min + rnd * (max - min); }; for (var i= 0; i<10; i++) { document.writeln(Math.seededRandom() +"<br />"); }

运行如上代码你会发现如果种子Math.seed不变,那么生成的随机数是不会变化的,哦了,如果引入这个函数,那么重现游戏场景可以实现了,虽然还需要做更多的细节处理,但机制上是能保证的,本文的重点不是实现一个这样的游戏。

本文的重点是:(Math.seed * 9301 + 49297) % 233280,为什么会是这三个值,而不是其它的到底这三个数字有什么神秘的来历呢?

像Math.seededRandom这种伪随机数生成器叫做线性同余生成器(LCG, Linear Congruential Generator),几乎所有的运行库提供的rand都是采用的LCG,形如:

I n+1=aI n+c(mod m)

生成的伪随机数序列最大周期m,范围在0到m-1之间。要达到这个最大周期,必须满足:
1.c与m互质

2.a - 1可以被m的所有质因数整除

3.如果m是4的倍数,a - 1也必须是4的倍数

以上三条被称为Hull-Dobell定理。作为一个伪随机数生成器,周期不够大是不好意思混的,所以这是要求之一。因此才有了:a=9301, c = 49297, m = 233280这组参数,以上三条全部满足。

总结

以上就是关于种子随机数在JS中如何实现和作用介绍的内容,希望给JavaScript学习者有所帮助

Javascript 相关文章推荐
遨游,飞飞,IE,空中网 浏览器无提示关闭方法
Jul 11 Javascript
javascript scrollTop正解使用方法
Nov 14 Javascript
jquery实现submit提交表单
Feb 03 Javascript
利用AJAX实现WordPress中的文章列表及评论的分页功能
May 17 Javascript
深入理解JavaScript 函数
Jun 06 Javascript
浅析使用BootStrap TreeView插件实现灵活配置快递模板
Nov 28 Javascript
谈谈Vue.js——vue-resource全攻略
Jan 16 Javascript
微信小程序scroll-view组件实现滚动动画
Jan 31 Javascript
cnpm加速Angular项目创建的方法
Sep 07 Javascript
在Vue项目中用fullcalendar制作日程表的示例代码
Aug 04 Javascript
解决vue cli使用typescript后打包巨慢的问题
Sep 30 Javascript
解决Vue项目打包后打开index.html页面显示空白以及图片路径错误的问题
Oct 25 Javascript
全面了解JavaScript对象进阶
Jul 19 #Javascript
EasyUI中在表单提交之前进行验证
Jul 19 #Javascript
jQuery EasyUI提交表单验证
Jul 19 #Javascript
js 动态添加元素(div、li、img等)及设置属性的方法
Jul 19 #Javascript
JS把内容动态插入到DIV的实现方法
Jul 19 #Javascript
JS动态给对象添加事件的简单方法
Jul 19 #Javascript
老生常谈js动态添加事件--- 事件委托
Jul 19 #Javascript
You might like
php cout&amp;lt;&amp;lt;的一点看法
2010/01/24 PHP
jQuery+PHP实现的掷色子抽奖游戏实例
2015/01/04 PHP
php遍历、读取文件夹中图片并分页显示图片的方法
2016/11/15 PHP
Laravel5.7 Eloquent ORM快速入门详解
2019/04/12 PHP
PHP从零开始打造自己的MVC框架之入口文件实现方法详解
2019/06/03 PHP
DEFER怎么用?
2006/07/01 Javascript
JavaScript CSS修改学习第二章 样式
2010/02/19 Javascript
javascript学习笔记(五)正则表达式
2011/04/08 Javascript
通过jquery还原含有rowspan、colspan的table的实现方法
2012/02/10 Javascript
JavaScript函数内部属性和函数方法实例详解
2016/03/17 Javascript
仅9张思维导图帮你轻松学习Javascript 就这么简单
2016/06/01 Javascript
jquery实现全选、全不选以及单选功能
2017/03/23 jQuery
js封装成插件_Canvas统计图插件编写实例
2017/09/12 Javascript
教你用Cordova打包Vue项目的方法
2017/10/17 Javascript
用POSTMAN发送JSON格式的POST请求示例
2018/09/04 Javascript
vuex实现及简略解析(小结)
2019/03/01 Javascript
vue+ts下对axios的封装实现
2020/02/18 Javascript
微信小程序分享小程序码的生成(带参数)以及参数的获取
2020/03/25 Javascript
python利用beautifulSoup实现爬虫
2014/09/29 Python
Python中的XML库4Suite Server的介绍
2015/04/14 Python
在Django的视图(View)外使用Session的方法
2015/07/23 Python
读取json格式为DataFrame(可转为.csv)的实例讲解
2018/06/05 Python
对Tensorflow中的变量初始化函数详解
2018/07/27 Python
对python遍历文件夹中的所有jpg文件的实例详解
2018/12/08 Python
centos 安装Python3 及对应的pip教程详解
2019/06/28 Python
如何获取Python简单for循环索引
2019/11/21 Python
tensorflow:指定gpu 限制使用量百分比,设置最小使用量的实现
2020/02/06 Python
基于python实现获取网页图片过程解析
2020/05/11 Python
Python 实现PS滤镜中的径向模糊特效
2020/12/03 Python
使用CSS3编写类似iOS中的复选框及带开关的按钮
2016/04/11 HTML / CSS
html5 Web SQL Database 之事务处理函数transaction与executeSQL解析
2013/11/07 HTML / CSS
第一批党的群众路线教育实践活动总结报告
2014/07/03 职场文书
四风个人对照检查材料思想汇报
2014/09/25 职场文书
三八红旗手主要事迹材料
2015/11/04 职场文书
教你nginx跳转配置的四种方式
2022/07/07 Servers
Python 避免字典和元组的多重嵌套问题
2022/07/15 Python