javascript实现抽奖程序的简单实例

昨天开年会的时候看到一个段子说唯品会年会抽奖，结果大奖都被写抽奖程序的部门得了，CTO现场review代码。

简单想了一下抽奖程序的实现，花了十几分钟写了一下，主要用到的知识有数组添加删除，以及ES5 数组新增的indexOf,filter方法，

为了刷新页面后仍能保存已中奖记录，用了localStorage存盘。

刚开始是用随机数直接取编号，发现要剔除已中奖的人很麻烦，如果重复要递归调用，如果中奖的人太多到最后随机数取到已中奖的人概率太大，所以换用两个数组实现，一个记录已中奖的号码，一个记录未中奖的号码，已中奖的从另一个数组剔除就行，就不存在递归调用的情况。

具体实现如下：

var start=1,end=20,luckyList=[],futureList=[];//luckyList表示已获奖的人，futureList表示尚未抽中的人，start,end表示奖券起止编号

//先初始化一下所有人员编号的数组
for(var i=start;i<=end;i++){
futureList.push(i);
}
//如果刷新了页面，从localStoreage中恢复
if(localStorage.getItem("lucky")){
luckyList=localStorage.getItem("lucky").split(",");
futureList=futureList.filter(function(item){
return luckyList.indexOf(item)==-1;
})
console.log(futureList)
}

//抽奖函数，每运行一次，产生一个幸运号码
function raffle(){
var num= Math.random()*futureList.length;
num=Math.floor(num);
var idx=futureList.indexOf(num);
var result= futureList.splice(idx,1)[0].toString();
luckyList.push(result);
localStorage.setItem("lucky",luckyList);
console.log("抽奖结果：",result); 

}
//清除localstorge，如果要复位程序执行此函数
function clear(){
localStorage.setItem("lucky","");

}

raffle();

以上这篇javascript实现抽奖程序的简单实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • javascript圆盘抽奖程序实现原理和完整代码例子

    javascript圆盘抽奖程序实现原理和完整代码例子

    效果预览: 一.模拟抽奖的实现过程 旋转原理:当支持CSS3属性采用transform: rotate(角度deg)设置,当角度为正数时顺时针旋转,当为负数时逆时针旋转.如果是IE8及其以下,采用采用绝对定位设置top和left,模拟角度旋转. run方法,参数angle指角度 复制代码 代码如下: function run(angle) {                    if (isIE) {                        cosDeg = Math.cos(angle

  • javascript 随机抽奖程序代码

    随机抽奖程序 请单击开始抽奖 开始抽奖(S) 停止(O) [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

  • javascript实现抽奖程序的简单实例

    昨天开年会的时候看到一个段子说唯品会年会抽奖,结果大奖都被写抽奖程序的部门得了,CTO现场review代码. 简单想了一下抽奖程序的实现,花了十几分钟写了一下,主要用到的知识有数组添加删除,以及ES5 数组新增的indexOf,filter方法, 为了刷新页面后仍能保存已中奖记录,用了localStorage存盘. 刚开始是用随机数直接取编号,发现要剔除已中奖的人很麻烦,如果重复要递归调用,如果中奖的人太多到最后随机数取到已中奖的人概率太大,所以换用两个数组实现,一个记录已中奖的号码,一个记录未

  • Java实现一个小说采集程序的简单实例

    被标题吸引进来的不要骂我. 只是一个简单的实现,随手写了来下载一部喜欢的小说的.示例中的小说只是示例,不是我的菜. 使用了jsoup.挺好用的一个工具. 有需要的话,参考下自己改吧.挺简单的,是吧. 代码如下: package com.zhyea.doggie; import java.io.File; import java.io.FileWriter; import java.io.IOException; import org.jsoup.Jsoup; import org.jsoup.n

  • Javascript 正则表达式校验数字的简单实例

    实例如下: $("input[datatype=number]").blur(function () { var str = $(this).val(); if (!isDecimal(str)) { alert("请输入数字"); } }); function isDecimal(str) { if (isInteger(str)) return true; var re = /^[-]{0,1}(\d+)[\.]+(\d+)$/; if (re.test(str

  • 模拟javascript中的sort排序(简单实例)

    一.javascript中sort对数据进行排序的原理 sort() 方法对数组的元素做原地的排序,并返回这个数组. sort 可能不是稳定的.默认按照字符串的Unicode码位点排序; 语法:arr.sort([compareFunction]) 参数 compareFunction 可选.用来指定按某种顺序进行排列的函数.如果省略,元素按照转换为的字符串的诸个字符的Unicode位点进行排序. 如果 compareFunction(a, b) 小于 0 ,那么 a 会被排列到 b 之前: 如

  • 如何判断Javascript对象是否存在的简单实例

    Javascript语言的设计不够严谨,很多地方一不小心就会出错. 举例来说,请考虑以下情况. 现在,我们要判断一个全局对象myObj是否存在,如果不存在,就对它进行声明.用自然语言描述的算法如下: if (myObj不存在){ 声明myObj; } 你可能会觉得,写出这段代码很容易.但是实际上,它涉及的语法问题,远比我们想象的复杂.Juriy Zaytsev指出,判断一个Javascript对象是否存在,有超过50种写法.只有对Javascript语言的实现细节非常清楚,才可能分得清它们的区别

  • JavaScript String(字符串)对象的简单实例(推荐)

    JavaScript String(字符串)对象的简单实例(推荐)

    返回字符串的长度: <html> <body> <script type="text/javascript"> var txt="Hello World!" document.write(txt.length) </script> </body> </html> 为字符串添加样式: <html> <body> <script type="text/java

  • JavaScript设计模式之工厂模式简单实例教程

    JavaScript设计模式之工厂模式简单实例教程

    本文实例讲述了JavaScript设计模式之工厂模式.分享给大家供大家参考,具体如下: 一.工厂模式概念 工厂模式定义一个用于创建对象的接口,这个接口由子类决定实例化哪一个类.该模式使一个类的实例化延迟到了子类.而子类可以重写接口方法以便创建的时候指定自己的对象类型(抽象工厂). 这个模式十分有用,尤其是创建对象的流程赋值的时候,比如依赖于很多设置文件等.并且,你会经常在程序里看到工厂方法,用于让子类定义需要创建的对象类型. 二.工厂模式的作用和注意事项 模式作用: 1.对象构建十分复杂--我们

  • javascript 闭包详解及简单实例应用

    JS 闭包详解及实例: 最近学习JS的基础知识,学习了闭包的知识点,有很多疑惑,这一段时间还是一直有在看闭包的相关知识理解就更深入了一点,下面说说我的理解. function fn(){ var a = 0; return function (){ return ++a; } } 如上所示,上面第一个return返回的就是一个闭包,那么本质上说闭包就是一个函数.那么返回这个函数有什么用呢? 那是因为这个函数可以调用到它外部的a这个变量.其实也就是说,return返回的是这个函数 + a这个变量

  • javascript实现数字验证码的简单实例

    实例如下: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv=

随机推荐