当前位置:首页 > JavaScript

js实现麻将

2026-04-05 11:37:42JavaScript

麻将游戏实现概述

使用JavaScript实现麻将游戏需要处理洗牌、发牌、玩家操作、胡牌判定等核心逻辑。以下是关键实现步骤:

基础数据结构

麻将牌通常包含万、条、筒、字牌四类,共136张牌(部分规则使用144张)。可以用数组表示初始牌组:

const tiles = [
  '1万', '2万', '3万', '4万', '5万', '6万', '7万', '8万', '9万',
  '1条', '2条', '3条', '4条', '5条', '6条', '7条', '8条', '9条',
  '1筒', '2筒', '3筒', '4筒', '5筒', '6筒', '7筒', '8筒', '9筒',
  '东', '南', '西', '北', '中', '发', '白'
];
// 每种牌4张
const fullDeck = [...tiles, ...tiles, ...tiles, ...tiles];

洗牌算法

使用Fisher-Yates洗牌算法实现随机排序:

function shuffle(deck) {
  for (let i = deck.length - 1; i > 0; i--) {
    const j = Math.floor(Math.random() * (i + 1));
    [deck[i], deck[j]] = [deck[j], deck[i]];
  }
  return deck;
}

发牌逻辑

四人麻将通常每人13张牌,庄家14张:

function dealTiles(deck) {
  const players = [[], [], [], []];
  for (let i = 0; i < 3; i++) {
    for (let j = 0; j < 4; j++) {
      for (let k = 0; k < 4; k++) {
        players[k].push(deck.pop());
      }
    }
  }
  // 最后一轮每人一张
  for (let j = 0; j < 4; j++) {
    players[j].push(deck.pop());
  }
  // 庄家多拿一张
  players[0].push(deck.pop());
  return { players, remainingDeck: deck };
}

胡牌算法

实现七对、平胡等常见胡牌规则:

function checkWin(hand) {
  // 七对判定
  if (hand.length === 14) {
    const tileCount = {};
    hand.forEach(tile => {
      tileCount[tile] = (tileCount[tile] || 0) + 1;
    });
    return Object.values(tileCount).every(count => count === 2);
  }

  // 平胡判定(需要实现更复杂的牌型分析)
  return checkStandardWin(hand);
}

前端交互

使用DOM操作或Canvas实现界面:

js实现麻将

// 示例:创建牌元素
function createTileElement(tile) {
  const div = document.createElement('div');
  div.className = 'tile';
  div.textContent = tile;
  div.addEventListener('click', () => handleTileClick(tile));
  return div;
}

完整流程示例

  1. 初始化牌组并洗牌
  2. 发牌给四位玩家
  3. 实现摸牌、打牌、吃碰杠等操作
  4. 实时检查胡牌条件
  5. 处理结算逻辑

性能优化建议

  • 使用Web Workers处理复杂计算
  • 采用对象池管理牌对象
  • 使用位运算加速牌型分析
  • 实现脏检查减少DOM操作

完整实现需要考虑具体麻将规则(如广东麻将、四川血战等),上述代码提供了基础框架。实际开发中还需加入网络通信模块实现多人对战功能。

标签: 麻将js
分享给朋友:

相关文章

js实现分页

js实现分页

实现分页的基本思路 分页功能通常需要处理数据分割、页码生成和用户交互。核心逻辑包括计算总页数、根据当前页截取数据、渲染页码按钮等。 前端分页实现(静态数据) 假设已有全部数据,仅需前端分页展示:…

js实现选项卡

js实现选项卡

实现选项卡的基本思路 选项卡通常由一组标签和对应的内容面板组成。点击标签时,显示对应的内容面板,隐藏其他面板。实现这一效果需要结合HTML结构、CSS样式和JavaScript交互逻辑。 HTML结…

js实现vr

js实现vr

使用WebXR API实现VR体验 WebXR是浏览器中实现VR和AR体验的标准API,它取代了早期的WebVR。现代浏览器如Chrome、Edge和Firefox已支持WebXR。 // 初始化W…

js实现选题

js实现选题

实现选题功能的JavaScript方法 基础实现方案 使用数组存储选项,通过随机索引选取: const options = ['选项A', '选项B', '选项C', '选项D']; const r…

js怎么实现异步

js怎么实现异步

异步实现方法 JavaScript中实现异步操作主要通过以下几种方式: Promise Promise是ES6引入的异步解决方案,用于处理异步操作的成功或失败状态。 const promise =…

js实现路由

js实现路由

js实现路由的方法 在JavaScript中实现路由功能可以通过多种方式完成,以下是几种常见的方法: 使用原生JavaScript实现路由 通过监听window.onhashchange事件来实现基…