微信小程序之坦克大战学习

1.问题一：在menu.js中需要使用到const.js文件中的变量，怎么办？如下图：

 

解决：在const.js文件中写上module.exports={},大括号里面写对应的变量对，如下图：

 然后在menu.js文件中，使用require引入，如下图：

这样，一个文件就可以使用另一个文件定义的变量了，class的访问是通过import来访问的。

2.开始页面显示出来了，接下来是选择player的数目。在Main中初始化事件监听，看下面的代码：

  然后看一下initEvent()的内容，这里监听了touchstart事件，实现的效果是点击屏幕任意一点，改变palyer的位置（1还是2）：

  

  

  3.后续的工作内容大致上跟上面的一样，这里贴一下最终的开发进度图：

  整体的流程是先绘制出来地图块，玩家坦克，敌方坦克，然后敌方坦克随机的移动和射击，敌方坦克的边界检测部分卡住的事件最长，然后一点一点的打印，搞清楚了里面的机制和流程，接下来是方向键控制玩家坦克的移动和射击，图中的A键是玩家1的射击键。最后再加一个游戏结束的功能基本上就把主流程开发完成了。

4.由于没有一步一步的开发和记录文档，这里就记录一下开发中的难点和问题

  4.1 微信小程序中的eval不支持，所以暂时先用的是注释掉的代码行，如下面的程序：

setMapLevel(level) {
		this.level = level;
		var tempMap = eval("map" +  this.level); //这里就是拼接，然后获取到真正的array，但微信不支持eval函数
		//var tempMap = LEVEL.map1;
		console.log("tempMap length is "+LEVEL.map1); //for test
		this.mapLevel = new Array();
		for (var i=0;i<tempMap.length; i++) {
			this.mapLevel[i] = new Array();
			for (var j=0; j<tempMap[i].length; j++) {
				this.mapLevel[i][j] = tempMap[i][j];
			}
		}
	}

   4.2 在tank.js中，玩家坦克、主界面中的选择坦克、敌方坦克都会有一句代码是（这里拿PlayTank举例 ）：
    PlayTank.prototype = new Tank()

    初步的理解是跟继承差不多，用了Tank类中的属性和方法，如果PlayTank定义了同名方法和属性，则执行PlayTank中的方法和属性。

   4.3 export和import中也有一些问题，在使用isGameOver变量的时候，现在main.js 中export了isGameOver，然后在Collision.js中使用了isGameOver，这时候编译器报了isGameOver是read-only属性，最后解决办法是在main.js中定义了方法并export，然后方法中设置isGameOver的值，最后在Collision.js中import此方法并调用。