JS製作的炸金花小遊戲的例子

學習JS的時候突然想起了小時候經常玩的一個遊戲，叫做“炸金花”，然後就試著把這個小遊戲做了出來，在整個遊戲實現的過程中，獲益匪淺。“炸金花”的商務程序主要是：構建一副牌->隨機發牌->比較牌大小->顯示牌及結果。下面是詳細的實現過程。

眾所周知，一副撲克牌有4個花色，每個花色13張點數，加上兩個joker一共是54張，我們這裡沒有用到joker，所以是52張。構建撲克牌用 到了一個很好玩的演算法——洗牌演算法。洗牌演算法其實很簡單，就是定義兩個數組，一個數組儲存花色，一個數組儲存點數，兩個數組相結合，就組成一副不含大小王 的52張撲克牌。

//構建牌組
var arrcolor=["clubs","hearts","spade","diamonds"]; //花色
var arrnum=["02","03","04","05","06","07","08","09","10","11","12","13","14"];  //點數
for (var i=0; i<4;i++) {
 for(var j=0;j<13;j++){
  cords[k]=[arrcolor[i],arrnum[j]]; //含有52張牌的二維數組
  k++;
 }
};

洗牌演算法還有其它的一些用法，比如隨機起名字。一般玩遊戲的時候系統會有一個隨機起名的功能，那個功能就是洗牌演算法實現的。定義兩個數組，一個數組儲存姓氏，一個數組儲存名字，隨機從兩個數組中各取出一個值，就組成了一個隨機的名字。 ## 隨機發牌 隨機發牌就是從構建好的52張撲克牌中隨機選出六張，分別發給電腦和玩家。這裡有個地方需要注意一下就是選出的牌不能是重複的。我記得有道面試題是隨機不重複輸出1-1000之間的100數。想一想，要怎麼寫才能實現？ 當時我在做這個小遊戲時候，第一個想法是將含有52張牌數組打亂，然後隨便取出前六個就行了，這個方法如果在PHP中很好實現，因為PHP中含有打亂數組的內建函數，JS中我沒有找到類似的函數。所以就用了下面這個方法：

var randcords=new Array();
for(i=0;i<6;i++){
 var cordnum=Math.ceil(Math.random()*(51-i));
 randcords[i]=cords[cordnum];
 cords.splice(cordnum,1);
}

取出一張牌後便將其刪掉，從剩下的數組中繼續取牌，就可獲得六張不重複的隨機撲克牌 ## 比較牌大小 如何比較兩個人手牌的大小呢？這個應該是這個遊戲的關鍵，三張牌大小一樣為暴子，顏色一樣是清一色，點數連續是順子，有兩張點數相同為對子，暴子> 清一色>順子>對子，什麼都沒有則依次比較最大牌的點數。在我一籌莫展之時正好羅老師講到燈開關的相關知識。然後我就用在了這裡，而且成功 了。

//計算電腦牌的權值
var pc_num=new Array(cords[0][1],cords[1][1],cords[2][1]);//將電腦牌的數字部分存入數組
var pc_num=pc_num.sort();//將電腦牌的數字部分排序
var pc_val=0;//初始化權值
if (pc_num[0]==pc_num[1]==pc_num[2]) { //判斷是否為暴子
 pc_val+=3*1e8;
}
if (cords[0][0]==cords[1][0]&&cords[1][0]==cords[2][0]) { //判斷是否為清一色
 pc_val+=2*1e8;
}
//判斷是否為順子
if (Number(pc_num[1])-Number(pc_num[0])==1&&Number(pc_num[2])-Number(pc_num[1])==1) {
 pc_val+=1e8;
}
if (pc_num[0]==pc_num[1]||pc_num[1]==pc_num[2]) {  //判斷是否為對子
 pc_val+=1e7;
 var tem="";
 tem=pc_num[2];
 pc_num[2]=pc_num[1];
 pc_num[1]=tem;
}
pc_val+=Number(pc_num.reverse().join(""));  //計算電腦牌的最終權值
//計算玩家權值
var play_num=new Array(cords[3][1],cords[4][1],cords[5][1]);//將玩家牌的數字部分存入數組
var play_num=play_num.sort();//將電腦牌的數字部分排序
var play_val=0;//初始化權值
if (play_num[0]==play_num[1]==play_num[2]) { //判斷是否為暴子
 play_val+=3*1e8;
}
if (cords[3][0]==cords[4][0]&&cords[4][0]==cords[5][0]) { //判斷是否為清一色
 play_val+=2*1e8;
}
if (Number(play_num[1])-Number(play_num[0])==1&&Number(play_num[2])-Number(play_num[1])==1) {  //判斷是否為順子
 play_val+=1e8;
}
if (play_num[0]==play_num[1]||play_num[1]==play_num[2]) {  //判斷是否為對子
 play_val+=1e7;
 var tem="";
 tem=play_num[2];
 play_num[2]=play_num[1];
 play_num[1]=tem;
}
play_val+=Number(play_num.reverse().join(""));  //計算玩家牌的最終權值
//權值比較
if (pc_val>play_val) {
 $("#result").text("電腦贏了！");
}else if(pc_val<play_val){
 $("#result").text("你贏了！");
}else{$("#result").text("打平了！");}

這段代碼比較多，其實道理很簡單，就是定義一個八位的數(初始值8個0)，如果是暴子，權值最高，將第八位變為1，如果是清一色則將第七位變為1，以此類推，最後比較兩個人手牌的權值，權值高的贏。 ## 顯示牌及結果 這裡就沒什麼可說的了，就是將取出的六張牌展示，然後顯示比較結果OK啦！

//顯示電腦的牌
$("#cord1").attr("src","img/"+randcords[0].join("-")+".png");
$("#cord2").attr("src","img/"+randcords[1].join("-")+".png");
$("#cord3").attr("src","img/"+randcords[2].join("-")+".png");
//顯示玩家的牌
$("#cord4").attr("src","img/"+randcords[3].join("-")+".png");
$("#cord5").attr("src","img/"+randcords[4].join("-")+".png");
$("#cord6").attr("src","img/"+randcords[5].join("-")+".png");

## 總結 開始覺得難的東西其實並不難，多想想就會了，難的是開始覺得簡單，卻越做越覺得難的東西。