【文件属性】：
文件名称：JavaScript实现像素鸟
文件大小：475KB
文件格式：ZIP
更新时间：2020-03-06 08:43:48
JavaScript 像素鸟 面向对象
下载后可以在webstrom中打开运行。
1. underscore中random产生随机数、without从数组中移除数据
2. 在游戏开发的时候，应该始终用面向对象的思想来做。有一个游戏管控大类（Game）。
3. 用一个json文件，保存我们需要的图片数据，方便在内存中创建每一张图片对象。
4. canvas的宽度和高度不能固定，根据电脑动态设置。
5. 使用ES6语法创建类。
6. FPS （每秒传输帧数(Frames Per Second)） 刷新率FNO 记录当前走过总帧数
7. 在每一次canvas绘制之前，都要进行清屏操作。ctx.clearRect(0, 0, canvas.width, canvas.height);
8. 资源加载。通过AJAX加载资源。静态资源类StaticResourceUtil.js用来加载本地图片。
9. 图片绘制，背景类BackGround.js，用来绘制背景。
通过图片的移动实现游戏的移动。
图片的移动即不断改变图片的X坐标，不断绘制。
图片的无缝移动：绘制图片的两倍，当全部图片宽度走完的时候，将图片X重新改为0.
背景图的速度设置，事物离得越近速度越快，越远速度越慢。
10. 取整、字符串转数字：parseInt(txt);
11. 管道绘制，管道类Pipe.js，用来绘制管道。
管道的高度、位置要随机生成。
但要有最小高度与最大高度。
需要一个管道数组来保存所有的管道。
当管道移出画布，需要将管道从管道数组中移除。
12. 用gameEnd来标志游戏是否结束。
13. 鸟的绘制，鸟类bird.js，用来绘制鸟。
根据帧率不断煽动翅膀。
14. 模拟重力加速度，利用dY，不断更新鸟的y值。导致鸟的下落越来越快。
15. 鸟的旋转。利用save和restore保存和恢复画布的状态。
利用translate旋转画布的x、y轴，旋转鸟恢复。
16. 鼠标点击事件，在鸟的上升过程中，固定值模拟阻力。
17. 边界检测。上边界y<0。下面接y>canvas.height - 地板高度 - 鸟高度
18. 碰撞检测。利用管道进行检测。首先判断鸟有没有进到管道竖着的区域，再判断鸟是在空白天空区域还是管道区域，从而进行检测。
19. 小鸟死亡，在死亡的地方绘制鲜血。鲜血撒完游戏结束。
20. 分数类。根据几位判断分数显示基准线。判断小鸟是否飞到管道竖着的部分，如果飞过，则分数加一。
21. 求一个数字有几位。num.toString().length
22. 游戏初始化。设置背景及图片，点击开始后div隐藏。
【文件预览】：
像素鸟
----images()
--------gameover.png(65KB)
--------blood.png(248KB)
--------bird.png(3KB)
--------bg2.png(16KB)
--------pipe1.png(23KB)
--------die.png(5KB)
--------bg3.png(19KB)
--------pipe0.png(23KB)
--------gamebegin.png(79KB)
--------bg1.png(18KB)
--------number.png(26KB)
----index.html(2KB)
----js()
--------UnderScore.js(65KB)
--------Game.js(4KB)
--------Pipe.js(2KB)
--------Bird.js(4KB)
--------MyTool.js(14KB)
--------ScoreUtil.js(760B)
--------StaticResourceUtil.js(2KB)
--------BackGround.js(853B)
--------FrameUtil.js(784B)
----.idea()
--------misc.xml(179B)
--------modules.xml(277B)
--------像素鸟.iml(288B)
--------workspace.xml(2KB)
----resource.json(621B)