咪猪头算24 (Piggy Mi 24)

一个可爱的24点游戏网页应用，专为儿童设计，帮助他们学习数学运算，培养逻辑思维能力。

功能特点

• 🎲 随机生成4张扑克牌，提供无限的游戏乐趣
• 🧠 自动计算并展示所有可能的24点解法
• 🐷 可爱的小猪吉祥物互动，提供鼓励和提示
• 🎨 精美的卡片动画和视觉效果
• 📱 响应式设计，支持各种设备尺寸
• 💡 提供清晰的解题思路，适合学习
• 🚀 快速加载，流畅运行

技术栈

• 前端框架: 原生 HTML5 + CSS3 + JavaScript (ES Modules)
• 构建工具: Vite 7.2.4
• 部署工具: GitHub Pages
• 字体: Google Fonts (Fredoka One, Comic Neue)

安装与运行

克隆仓库

git clone https://github.com/yourusername/calc24.git
cd calc24

安装依赖

npm install

本地开发

npm run dev

应用将在 http://localhost:5173 启动

构建生产版本

npm run build

构建文件将生成在 dist 目录

预览生产版本

npm run preview

项目结构

calc24/
├── src/
│   ├── main.js          # 主应用逻辑
│   ├── generator.js     # 随机数字生成器
│   ├── solver.js        # 24点解题算法
│   ├── normalizer.js    # 解法去重器
│   ├── style.css        # 样式文件
│   └── counter.js       # 计数器（示例文件）
├── test/
│   ├── verify_solver.js      # 解题算法测试
│   └── verify_normalizer.js  # 解法去重测试
├── index.html           # 主HTML文件
├── package.json         # 项目配置
├── vite.config.js       # Vite配置
└── README.md            # 项目说明文档

核心算法说明

24点解题算法

本项目使用深度优先搜索（DFS）算法来求解24点问题：

1. 初始状态: 将4个数字转换为表达式对象
2. 递归搜索:
   • 每次从当前数字中选择两个，尝试所有4种运算
   • 生成新的表达式，将结果与剩余数字继续组合
   • 重复直到只剩下一个数字，判断是否等于24
3. 去重处理: 使用归一化算法去除重复的解法
4. 表达式格式化: 自动添加必要的括号，确保运算顺序正确

解法去重算法

为了避免重复显示本质相同的解法（如 (1+2)+3 和 1+(2+3)），项目使用了归一化算法：

1. 将表达式转换为标准形式
2. 应用数学等价规则简化
3. 生成唯一的签名用于比较

使用说明

1. 开始游戏: 打开应用后，系统会自动生成一组4张扑克牌
2. 思考解题: 尝试使用加减乘除运算，将4个数字组合成24
3. 换一组题目: 点击"换一组 (New)"按钮获取新的4张牌
4. 查看答案: 点击"看答案 (Hint)"按钮查看所有可能的解法
5. 学习提升: 观察解法，理解不同的运算组合方式

开发与部署

开发流程

1. 创建功能分支
2. 编写代码
3. 运行测试
4. 提交代码
5. 创建Pull Request

部署到GitHub Pages

npm run deploy

这将自动构建项目并部署到GitHub Pages

测试

项目包含基本的测试用例，确保核心算法的正确性：

运行测试

node test/verify_solver.js
node test/verify_normalizer.js

测试内容

• 验证解题算法能正确找出所有解法
• 确保解法去重功能正常工作
• 测试边界情况

---

享受游戏，快乐学习！ 🎉