基于JavaScript实现的小游戏合集【100012072】

# WeirdDot ## **_项目需求规格说明书_** ### 1. **_引言_** #### 1.1. **_编写目的_** 本文档的目的是详细地介绍 WeirdDot 所包含的需求， 以便客户能够确认产品的确切需求以及开发人员能够根据需求设计编码，以下叙述将结合文字描述、数据流图、ER 图等来描述 WeirdDot 的功能、性能、用户界面、运行环境、外部接口以及针对用户操作给出的各种响应。本文档的预期读者有客户、项目经理、开发人员以及跟该项目相关的其他竞争人员。 #### 1.2. **_范围_** 本文档规定了应用程序的功能规范需求。 ### 2. **_总体概述_** #### 2.1. **_软件概述_** ##### 2.1.1. **_项目介绍_** WeirdDot 是一款基于 JavaScript 实现的小游戏合集，该游戏使用简约统一的画风对几款小游戏进行整合和改编，该游戏合集适合比较喜欢简约风格游戏并且喜欢休闲类游戏的用户。 本应用程序功能包括选择游戏、开始游戏、返回上一步、提示下一步、回到主界面。具有以下特点： - 确保应用程序具有良好的系统性能，友好的用户界面。 - 较高的处理效率，便于使用和维护 - 采用成熟技术开发，使系统具有较高的技术水平和较长的生命周期 #### 2.2. **_软件功能_** ##### 2.2.1. **_结构图_**  ##### 2.2.2. **_功能模块图_**  #### 2.3. **_角色_**  ### 3. **_功能需求_** #### 3.1. **_主界面模块_** - **简介** 提供了用户选择具体小游戏游戏的功能 - **功能列表** - 选择游戏 ##### 3.1.1. **_选择游戏_** 用户需要选择一个游戏或者更换游戏时可以进行此操作。 #### 3.2. **_游戏模块_** - **简介** 提供了用户在进行游戏过程中可以进行的各种操作 - **功能列表** - 开始游戏 - 执行游戏动作 - 返回主界面 - 返回上一步 ##### 3.2.1. **_开始游戏_** 用户进入游戏后需要开始游戏以及重新开始下一轮可以使用此操作 ##### 3.2.2. **_执行游戏动作_** 用户在游戏过程中需要进行包括落子或者滑动时会执行此操作 ##### 3.2.3. **_返回主界面_** 用户在游戏过程中期望回到主菜单选择另一个游戏时可以执行此操作 ##### 3.2.4. **_返回上一步_** 用户在游戏过程中期望回到上一步操作是可以执行此操作 ### 4. **_性能需求_** 本项目性能需求有： - 浏览器的需求 - 网络环境的需求 - 应用程序运行时间的需求 ### 5. **_接口需求_** #### 5.1. **_用户接口_** 交互界面采用浏览器显示，适配性较高。 #### 5.2. **_软件接口_** 本应用程序可运行在主流浏览器上。 #### 5.3. **_通讯接口_** Internet 接入协议：TCP/IP、HTTP ### 6. **_总体设计约束_** #### 6.1 **_标准符合性_** 本应用程序的开发在源代码上遵循 JavaScript 编程规范及其开发标准 ### 7.**_软件质量特性_** #### 7.1. **_可靠性_** - 容错性:用户不合理的操作，不会造成应用程序不可用或应用程序崩溃(会)。客户端在不同 的操作系统下或不同的硬件配置下，都能正常工作，也不会因为用户在系统装了不同的软件，造 成本产品的工作不正常。. - 可掌性:提交给用户的最终产品在 6 个月的运行期间，不能有致命错误，严重错误不超过 5 次， 一般错误不超过 15 次。 - 可恢复性:当应用程序出现故障或机器硬件出现断电等情况，应用程序应该能自动恢复数据和 安全性等方面的功能。 #### 7.2. **_易用性_** - 易懂性:用户能够容易的理解该应用程序的功能及其适用性。 - 易学性:该应用程序简单易学，容易.上手。 - 易操作性:本应用程序除了鼠标操作外，还可通过快捷键进行相关的操作。 #### 7.3. **_可维护性_** 本应用程序未实现的功能正在进行完善中，另版本可进行升级。 #### 7.4. **_可测试性_** 产品的单元模块和最终产品的功能都是可验证和可测试的。 #### 7.5. **_可用性_** 本应用程序可用性强，只要能够使用浏览器访问相应页面即可使用。 ### 8. **_团队分工_** - 何凯：需求分析文档 1.0 - 何凯：主界面开发 - 何凯、yanghai：围住神经猫游戏开发 - 滕昶、陆春浩：五子棋游戏开发 - 吴文龙、廖宇阳：2048 游戏开发 ## **_软件设计说明书_** ### 1. **_围住神经猫_** #### 1.1. **_流程图_**  #### 1.2. **_类图_**  #### 1.3. **_时序图_**  #### 1.4. **_UI 图_**  ### 2. **_五子棋_** #### 2.1 **_时序图_** <img src="Gobang/时序图.png" width="60%" height="60%"> #### 2.2 **_UI 图_** - 游戏时的 ui <img src="Gobang/游戏ui.png" width="60%" height="60%"> - 结束画面 <img src="Gobang/结束界面.png" width="60%" height="60%"> #### 2.3 **_补充说明_** ##### 2.3.1 **_初始化界面_** - GameInit():生成棋盘，初始化数据结构 ##### 2.3.2 **_下棋_** - 调用 NextStep(location)： 位置有两个参数, 通过获取光标位置获得， 下一步的横轴和纵轴。实现思路如下： - 调用 anyWin():判断新下的一点在四个方向上是否有任一方向形成五连子，来判断是否达成获胜条件，如果任意一方获胜，则结束游戏 - 调用 aiNextStep()， 生成 ai 的下一步 - 调用 anyWin()，判断是否达成获胜条件，如果任意一方获胜，则结束游戏 - 将玩家和 ai 上一步的位置存入数组 lastStep[] - 如果玩家按下悔棋按钮，则调用 withDraw()撤回上一步的棋子 - 调用 resReturn 返回下棋结果 重复以上步骤,直至游戏结束 ##### 2.3.3 **_ai 算法_** - 调用评分算法 assese(), 判断当前局势。对每一个可下的点进行评估，选出评分最高的点，作为下一步的落点。 ##### 2.3.4 **_重新开始_** - 调用 refreshGame(): 设置棋盘为空，lastStep[]为空，等待用户下第一步 ##### 2.3.5 **_结束游戏_** - 调用 refreshGame() - 调用 showResult():显示结束界面，展示胜者 ### 3. **_2048_** #### 3.1 **_时序图_**  ##### 3.1.1 **_初始化界面_** 调用 ``gameInit()``：给最大分值和游戏分值绑定数据变量，刷新颜色，随机生成两个新元素。 ##### 3.1.2 **_元素移动_** 调用 ``move(direction)``： 移动有四个方向：上、下、左、右。实现思路如下： 如果触发向左移动 　　遍历所有非空元素 　　　　调用 ``itemMove(currentItem, direction)``: 　　　　如果当前元素在第一个位置 　　　　　　不动 　　　　如果当前元素不在第一个位置 　　　　　　如果当前元素左侧是空元素 　　　　　　　　向左移动 　　　　　　如果当前元素左侧是非空元素 　　　　　　　　如果左侧元素和当前元素的内容不同 　　　　　　　　　　不动 　　　　　　　　如果左侧元素和当前元素的内容相同 　　　　　　　　　　向左合并，增加合并后的分值*10 　　根据是否有元素�