? ? 一、實現(xiàn)功能：

? ? 10個玩家同時游戲，系統(tǒng)根據(jù)規(guī)則計算出G值，并且給相應(yīng)玩家分?jǐn)?shù)，游戲可以進(jìn)行多輪，由玩家自行控制，每一輪的分?jǐn)?shù)都會累計下來除非重新開始

? ? 二、 設(shè)計過程：

? ? 最開始打算用b/s來做這個游戲，后臺連接數(shù)據(jù)庫，一個表用來記錄玩家的用戶名密碼（登錄形式），另一個來記錄游戲信息。但是后來發(fā)現(xiàn)帶有數(shù)據(jù)庫

的b/s結(jié)構(gòu)過于復(fù)雜，比如系統(tǒng)如何判定所有玩家都已經(jīng)結(jié)束輸入然后開始計算。對于一個雙人項目反復(fù)登錄多個用戶在測試上也是個不小的負(fù)擔(dān)。只要有

用戶登錄，就要在filter中設(shè)置過濾選項，保證沒有登錄的游客不管訪問那個界面都會自動跳轉(zhuǎn)到登陸界面，這對于雙人項目來說也是個不小的工作量，所以

我們放棄了接入數(shù)據(jù)庫，打算將游戲數(shù)據(jù)存到內(nèi)存中，后臺用java處理。于是著手搭建了springMVC框架

? ? 在WEB-INF文件夾中配置好springMVC后出現(xiàn)了新的問題，js的json數(shù)組不能傳到后臺，我們認(rèn)為是框架配置的問題，經(jīng)過兩天時間沒有解決，所以也放棄了后臺的java

利用前端完成了所有的功能，下圖為之前寫的后臺java代碼和玩家類

?

? ? 關(guān)于框架配置的問題我會在團(tuán)隊項目之前解決的。

? ? 最終版本

? ? 游戲的全部功能在Input.js中實現(xiàn)

? ? 三、功能展示：

? ? 進(jìn)入首頁

? ? 點擊開始按鈕進(jìn)入游戲

? ? 規(guī)定游戲共有10名玩家，每個玩家點擊自己對應(yīng)的按鈕輸入數(shù)值，所有人輸入完畢后點擊輸入結(jié)束將數(shù)據(jù)提交給后臺，點擊查看結(jié)果按鈕查看本輪游戲結(jié)果和每名玩家的積分

? ? 輸入完畢后會進(jìn)行提示

?

? ? 全部輸入完畢點擊“輸入結(jié)束”按鈕

? ? 點擊“查看結(jié)果”按鈕

? ? 查看玩家分?jǐn)?shù)

? ? 查看G值

? ? 點擊繼續(xù)游戲按鈕回到游戲界面

? ? 多輪游戲之后

? ? 四、服務(wù)器的配置

? ? 我們使用的服務(wù)器為tomcat6.0.44版本，單擊“window”菜單，選擇下方的“Preferences”，找到Server下方的Tomcat，

單擊右方的Add按鈕，選擇已經(jīng)成功安裝的Tomcat版本，單擊Next，設(shè)置好tomcat的安裝目錄點擊ok即完成安裝

? ? 虛擬路徑的配置

? ? 劃線部分改為workspace中項目的webroot路徑，該路徑用auto代替，至此配置完成

? ? 啟動服務(wù)器

? ??

? ? 啟動成功

? ? 五、編寫過程

? ? 前臺模板借助bootstrap3.3.2，開始界面Start.jsp直接通過一個標(biāo)簽跳轉(zhuǎn)游戲界面Input.jsp，所以不需要Start.js，

在Input.js中初始化了三個數(shù)組分別用來存儲玩家輸入的數(shù)值，輸入數(shù)值跟G相差的絕對值，玩家的分?jǐn)?shù)，玩家分?jǐn)?shù)全部初

始化為0。

var mynum=new Array(10) var score=new Array(10) var res=new Array(10) var flag=0; res[0]=0; res[1]=0; res[2]=0; res[3]=0; res[4]=0; res[5]=0; res[6]=0; res[7]=0; res[8]=0; res[9]=0;

　　前臺共有十個button，每一個button對應(yīng)一個prom()函數(shù)，10個函數(shù)結(jié)構(gòu)類似

<button type="button" class="btn btn-lg btn-primary" onClick="prom0()">Player_0</button><button type="button" class="btn btn-lg btn-primary" onClick="prom1()">Player_1</button><button type="button" class="btn btn-lg btn-primary" onClick="prom2()">Player_2</button><button type="button" class="btn btn-lg btn-primary" onClick="prom3()">Player_3</button><button type="button" class="btn btn-lg btn-primary" onClick="prom4()">Player_4</button><br><br><button type="button" class="btn btn-lg btn-primary" onClick="prom5()">Player_5</button><button type="button" class="btn btn-lg btn-primary" onClick="prom6()">Player_6</button><button type="button" class="btn btn-lg btn-primary" onClick="prom7()">Player_7</button><button type="button" class="btn btn-lg btn-primary" onClick="prom8()">Player_8</button><button type="button" class="btn btn-lg btn-primary" onClick="prom9()">Player_9</button>

　　輸入的數(shù)如果不符合要求還會要求用戶重新輸入

function prom0() { var number=prompt("Please enter your num","")if (number<100 && number>0){//alert(flag);mynum[0]=number;//document.write(mynum[flag]);alert("your number is :"+mynum[0]);}else{alert("輸入的數(shù)不符合要求")prom0();} }

　　每個玩家通過點擊按鈕將數(shù)值傳遞給后臺的mynum[]數(shù)組，輸入完畢后點擊“輸入結(jié)束”按鈕，觸發(fā)send()函數(shù)，計算出G的值，以下為send()的部分代碼

第一個循環(huán)用來報錯，檢測未輸入的玩家并提示，之后算出G值

for(var i=0;i<10;i++)//報錯if(!(mynum[i]>0&&mynum[i]<100)){alert("player_"+i+"未輸入，請重試")return 0;}var ave=0;for(var i=0;i<10;i++){ave=parseFloat(mynum[i])+parseFloat(ave);//alert(ave);}//alert(ave);ave=ave/i;G=parseFloat(ave)*0.618;

　　因為javascript是一種弱語言，定義的var變量有的時候會被當(dāng)成字符串，也就是說1+2=3有時候會被算成"1"+"2"="12"，所以在計算前要將變量類型進(jìn)行規(guī)定

此處用到了parseFloat()函數(shù)。否則算出的結(jié)果會顯示NaN，即代表非數(shù)字值的特殊值。

? ? 計算完G值，用數(shù)組score[]存放mynum[]-G的絕對值，分別計算出最大值最小值，再通過一個新的for循環(huán)找出離G最遠(yuǎn)的玩家和離G最近的玩家，進(jìn)行給分，用

res[]數(shù)組存放玩家的分?jǐn)?shù)。

for(var i=0;i<10;i++){score[i]=parseFloat(mynum[i])-parseFloat(G);if(score[i]<0)score[i]=0-parseFloat(score[i]);}var max=score[0];var min=score[0];for(var i=1;i<10;i++){if(max<score[i])max=score[i];if(min>score[i])min=score[i];}for(var i=0;i<10;i++){if(score[i]==max){res[i]=parseInt(res[i])-2;}if(score[i]==min){res[i]=parseInt(res[i])+10;}}

　　前臺jsp由我修改，js代碼由我和唐翔宜同學(xué)共同完成

? ? 編寫過程中和編寫完成后出現(xiàn)的問題及解決方案請見唐翔宜同學(xué)的博客

? ? http://www.cnblogs.com/tangxiangyi/p/5357833.html

? ? 代碼已上傳到coding

轉(zhuǎn)載于:https://www.cnblogs.com/wangtianning1223/p/5357294.html

總結(jié)

以上是生活随笔為你收集整理的结对编程 黄金点游戏的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。