下面小编就为大家带来一篇 javascript 实现抽奖程序的简单实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
昨天开年会的时候看到一个段子说唯品会年会抽奖,结果大奖都被写抽奖程序的部门得了,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 实现抽奖程序的简单实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持 phperz。
来源: http://www.phperz.com/article/17/0226/265068.html