通過JavaScript實現撲克牌遊戲的範例程式碼

2022-07-13 14:00:18

首先，我們知道一副牌裡有54張牌，然後牌裡的數位是從 3 - 2 的裡面總共有13張牌，然後 4 中花色分別是 ♠️ ♥️ ♣️ ♦️ 另外加上2個大小王！第一步：我們肯定需要有一個陣列來裝牌吧？然後再書寫一個函數，我們知道有多少張牌，然後牌裡有多少花色是不是應該用一個雙重回圈將 number 裡面的內容和 flower 裡面的內容進行一個迴圈嵌入？最後在用 push 生成一個物件放到陣列的後面？再到最後放入大小王。

const number = ['3', '4', '5', '6', '7', '8', '9', '10', "J", "Q", "K", "A", '2'];
const flower = ["♠️", "♥️", "♣️", "♦️"]; // 黑桃 < 紅心 < 梅花 < 方塊
/**
生成一個撲克牌，然後分發3副牌，1副牌中有17張牌，然後有四種顏色，底牌留三張。按照大小進行排序
 * 54 張
 * 大小王
 * 張三： 17
 * 李四： 17
 * 王五： 17
 * 底牌： 3
 * 
 * 排序 方塊3 黑桃3 升序  黑桃3-方塊3 如果點數相同，按花色排
 */

語法：

//系統牌
const number = ['3', '4', '5', '6', '7', '8', '9', '10', "J", "Q", "K", "A", '2'];
const flower = ["♠️", "♥️", "♣️", "♦️"]; // 黑桃 < 紅心 < 梅花 < 方塊
//牌組
let arr = [];

//生成牌的函數
poker();

//生成一副牌
function poker() {
    for (let n = 0; n < number.length; n++) {
        for (let j = 0; j < flower.length; j++) {
            arr.push({ name: flower[j] + number[n]})
        }
    }
    arr.push({ name: "小王" }, { name: "大王" })
}

輸出效果圖：

當我們已經拿到牌陣列了，像平時我們打牌是不是都是隨機發放手裡的牌的？那我們在進行一個打亂。這時候我們需要用到一個隨機生成的函數和一個去重生成下標的陣列。

語法：

//系統牌
const number = ['3', '4', '5', '6', '7', '8', '9', '10', "J", "Q", "K", "A", '2'];
const flower = ["♠️", "♥️", "♣️", "♦️"]; // 黑桃 < 紅心 < 梅花 < 方塊
//牌組
let arr = [];

//生成牌的函數
poker();

//打亂後的拆開後的牌組
let [zhangsan, wangwu, lisi, d] = create();

//列印輸出
console.log(zhangsan);
console.log(wangwu);
console.log(lisi);
console.log(d);

//生成一副牌
function poker() {
    for (let n = 0; n < number.length; n++) {
        for (let j = 0; j < flower.length; j++) {
            arr.push({ name: flower[j] + number[n]})
        }
    }
    arr.push({ name: "小王" }, { name: "大王" })
}

//生成一個亂數
function random(min, max) {
    if (max == undefined) {
        max = min;
        min = 0;
    }
    if (min > max) {
        [min, max] = [max, min];
    }
    let number = parseInt(Math.random() * (max - min + 1) + min)
    return number;
}

//打亂
function create() {
    let a = new Set();
    while (a.size < 54) {
        a.add(random(0, 53));
    }
    let arrindex = [...a];
    arr = arrindex.map(item => arr[item]);
    let zhangsan = arr.slice(0, 17);
    let wangwu = arr.slice(17, 34);
    let lisi = arr.slice(34, 51);
    let d = arr.slice(51);
    return [zhangsan, wangwu, lisi, d];
}

詳解：當我們知道需要發牌的時候是隨機生成的字牌，然後我們已經知道有54張牌，然後需要不重複的下標需要用到 Set 來曬重，陣列的長度是 54 但是下標是 53 所以在生成亂數的時候需要主要辨別。然後需要用到 map map的用意：通過指定函數處理陣列（遍歷陣列）的每個元素，並運算元組的元素或者下標，並返回處理後的陣列。當我們已經得到下標了是不是需要將 arr 裡面的元素進行找到，然後並將進行返回出來，然後再使用 slice slice的用意：用於把陣列中的字串元素轉換成數位陣列，元素是通過指定的分隔符進行分隔的。進行一個返回接收我們知道 zhangsan、wangwu、lisi 是有 17 張牌的而底牌只有三張可以得到手牌。並將函數裡面的內容返回出去進行一個接收輸出。

輸出效果圖：

在到最後我們需要一個排序。當 3 和 3 比肯定是沒有辦法比的是不是？我們在最開始拿到牌組的內容的時候就定義了黑桃 < 紅心 < 梅花 < 方塊這時候我們需要對牌的內容和數位進行一個大小對物件的新增。然後再書寫一個函數進行一個排序。排序需要用到 sort sort的用意：對陣列的元素進行排序，不是真實按照數位排列去排序的，按照字元進行一個比較。當需要比較數位需要重寫。例如sort((a,b)=> a-b)升序 sort((a,b)=> b-a) 降序！在生成牌組裡面需要新增花色的大小和數位的大小，最後進行一些列的優化程式碼如下：

語法：

const number = ['3', '4', '5', '6', '7', '8', '9', '10', "J", "Q", "K", "A", '2'];
const flower = ["♠️", "♥️", "♣️", "♦️"]; // 黑桃 < 紅心 < 梅花 < 方塊

let arr = [];

poker();

let [zhangsan, wangwu, lisi, d] = create();


sort(zhangsan);
sort(wangwu);
sort(lisi);
sort(d);

console.log("張三：",zhangsan);
console.log("王五：",wangwu);
console.log("王五：",lisi);
console.log("底牌：",d);

//排序
function sort(arr) {
    arr.sort((a,b)=>{if (a.number == b.number) {
        return a.flower - b.flower;
    }else{
        return a.number - b.number;
    }})
    
}
//生成一個亂數
function random(min, max) {
    if (max == undefined) {
        max = min;
        min = 0;
    }
    if (min > max) {
        [min, max] = [max, min];
    }
    let number = parseInt(Math.random() * (max - min + 1) + min)
    return number;
}

//打亂
function create() {
    let a = new Set();
    while (a.size < 54) {
        a.add(random(0, 53));
    }
    let arrindex = [...a];
    arr = arrindex.map(item => arr[item]);
    let zhangsan = arr.slice(0, 17);
    let wangwu = arr.slice(17, 34);
    let lisi = arr.slice(34, 51);
    let d = arr.slice(51);
    return [zhangsan, wangwu, lisi, d];
}

//生成一副牌
function poker() {
    for (let n = 0; n < number.length; n++) {
        for (let j = 0; j < flower.length; j++) {
            arr.push({ name: flower[j] + number[n],flower:j,number:n})
        }
    }
    arr.push({ name: "小王" ,number:53}, { name: "大王" ,number:54})
}

以上就是通過JavaScript實現撲克牌遊戲的範例程式碼的詳細內容，更多關於JavaScript撲克牌遊戲的資料請關注it145.com其它相關文章！

通過JavaScript實現撲克牌遊戲的範例程式碼

熱門文章