Javascript实现飞机大战小游戏

源码地址：https://github.com/markLijun/planeWar

最近看到一个用JS写的坦克大战小游戏，觉得好神奇，于是自己尝试着写了一个飞机大战。

敌机类

function Enemy(x, y)
this.x = x;
this.y = y;
this.moveId = null;
this.isLive = true;//当子弹打中敌机或敌机落地时死亡，isLive属性标记敌机是否已死
this.run = function run() {
if (this.y > boxheight || this.isLive == false) {
 
window.clearInterval(this.moveId);//如果飞机已经死亡，停止运动，this.moveId会在生产飞机的时候赋值
 
this.isLive = false;
}
else {
this.y += 2.5;
 
}
}
}

生产敌机的函数

function procuceEnemy() {
var x = Math.ceil(Math.random() * (boxwidth - planewidth));//敌机的横坐标，为画布宽度减去飞机宽度之间的随机值
theEnemy = new Enemy(x, boxy);
allEnemy.push(theEnemy);//allEnemy负责储存所有敌机，将新生产的敌机推入allEnemy栈
var moveId = window.setInterval("allEnemy[" + (allEnemy.length - 1) + "].run()", 60);//这是重点，使新制造的敌机每60ms run一次，并获得新敌机的moveId
allEnemy[(allEnemy.length - 1)].timer = timer;//把获得的moveId送给敌机类中的moveId，这里是对象引用
}

画敌机的函数

function drawEnemy() {
for (var i = 0; i < allEnemy.length; i++) {//遍历所有敌机（包括已死亡的和未死亡的）
if (allEnemy[i].isLive ==true) {//挑选出活着的敌机（即应该出现在画面上的敌机）
ctx.drawImage(enemyImage, allEnemy[i].x, allEnemy[i].y, enemywidth, enemyheight);//将它们画在画布上
}
}
}

为了使飞机的运动更加流畅，可以使用setInterval()函数改变飞机的坐标，按下方向键就会调用这个函数，松开就会取消。