TypeScript 面向对象实现的贪吃蛇小游戏
1. 游戏效果
-
方向键控制蛇的移动方向 蛇吃到食物后,身体多出一格,分数+1,食物重新刷新位置 最大等级为 8 级,每 2 分升一级,升级后蛇的移动速度增加 若蛇撞到边界或撞到自己,则游戏结束 刷新页面后游戏重新开始
2. 实现方法
贪吃蛇小游戏用 TypeScript 编写,HTML 骨架和 CSS 样式部分比较简单,很多方法都可以实现效果,这里就说一说 TS 的实现思路。
因为小游戏比较简单,所以没用使用webpack等打包,直接写将 TS 编译后的 JS 文件引入页面。TS 部分运用了面向对象的编程思想,首先需要创建四个类,分别是食物类Food、蛇类Snake、计分面板类ScorePanel、游戏控制类GameControl,分别给他们编写相应的属性和方法:
首先游戏控制类进行游戏初始化,通过定时器不断调用蛇移动方法。期间要判断用户按下的按键进行改变方向,判断蛇是否撞到自己、撞墙,判断蛇是否吃到食物,若吃到食物则加分、增加身体、刷新食物位置。根据分数判断是否升级。
3. 仓库地址
源代码已上传至:
欢迎在上访问!