javascript實現抽獎程式的簡單一實例_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實現抽獎程式的簡單一實例就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支援雲棲社區。