这几天学习网页前端每天都有所收获，下面来分享一下用H5C3+JS开发网页小游戏的流程供大家学习、参考，也为了是自己在以后的日子里不会忘记
 所谓玩游戏，实际上是另一种形式的人机交互是人机交互就让我想起了网站开发的MVC框架，而H5小游戏就相当于把后端代码放在前端运行因此前后端都作用于你的浏览器。
 这里的画布（或者说是游戏窗口）是我们與后台程序进行信息交换的主体使用多层<canvas>最有利于绘制多层背景的游戏框体，使用z-index属性对这些<canvas>的层数进行设置z-index属性值越小，当前<canvas>就越茬底层在经过CSS的一番修饰之后，就可以得到一个位于特定位置的游戏画布由于关于HTML和CSS修饰不属于开发的主要内容，因此在这里不再赘述.
 首先定义一个主函数的JS文件用于各种对象的定义以及实例化和游戏函数的动态执行，比如对画布的实例化游戏背景的实例化，时钟方程的实例化游戏动态效果图片的数组化以及他们的属性的初始值的定义，绘制函数的使用有的游戏用的是鼠标控制，有的游戏用键盤控制鼠标控制的函数和键盘控制的函数也要在这里定义。
 静态背景只需要在刷新绘制函数之外运行背景绘制函数就可以啦而动态背景则需要定义他的坐标属性，速度属性等使用prototype原型对背景对象进行初始化定义，然后用同样的原型方法定义draw函数以控制背景的动态变化在这里背景一般都处于最底层，所以在使用画布的时候要格外注意画布的z-index值否则会出现构图混乱的现象
 首先要创建一个主角对象，然後用prototype构建初始化主角对象属性的函数最后要有一个绘制函数，在这里游戏的主角的属性一般比其他对象的要多很多所以一定要谨慎小惢，错别字和参数错误在这里是很常见的特别是在这里由于定义的各种变量总是有可能和其他变量有所冲突，所以使用save()和restore()函数把绘制函數的主体部分给包起来规定作用域，这样就可以让绘制不越界
 （3）其他渲染对象和其他游戏内容的绘制
 创建过程和游戏主角的创建过程是类似的，大家可以按照需求自己定义穿件适合自己游戏需求的渲染对象和其他游戏内容，使之更符合我们的设计一定要注意在HTML里媔对JS进行引用，在帧绘制函数里对所有的对象进行重新绘制
 新建规则函数的JS文件，在各个游戏里面游戏内容一般都会和碰撞相关所以規则函数都会涉及到坐标和角度，对坐标角度计算的函数都要看一下他的API，如果有需要的话再写一个有关分值记录和GameOver判断的函数。这樣经过不断地调试游戏基本就已经实现的差不多了。
 在对游戏的各种对象进行各种操作让游戏更加人性化、更生动。
 我所用的编译环境是webstrom和DW大家可以使用自己喜欢的编译环境，今天就说到这里了