坦克大战之碰撞检测

描述问题：

图1

图2
当我们触发onkeydown事件时，长按箭头使得黑色色块（坦克）移动到距离蓝色色块（障碍物）很近的位置，再次触发onkeydown事件时，会出现图2穿墙的现象。

图3
黑色色块无法继续向前。

分析问题、解决问题：

问题一：
坦克会穿墙的问题，
解决一：
我们获取到黑色色块按照当前方向下一步的位置数据来判断，若可能会穿墙，就不继续执行，增加了getBox方法；
问题二：
根据问题一的解决，出现了新的问题，如图3所示：
该数据为长按箭头情况下，获取到的黑色色块的位置数据：

发现系统每运行5帧判断一次是否会穿墙；
解决二：
本质问题还是onkeydown是每5步检测一次和黑色色块是每次移动1px，2者不同步。因此只能把checkCollision事件放在绘制坦克的过程中，而非onkeydown和onkeyup之间。

onkeydown：

在本项目中，关于事件的处理过程，特别注意onkeydown中，按住状态时系统会每5帧触发一次onkeydown事件。