javascript飛機大戰-----008積分
阿新 • • 發佈:2017-09-10
for bsp 類型 math sco die() const fse lar
/* 創建敵機: */ function Enemy(blood,speed,imgs,scroe){ //敵機left this.left = 0; //敵機top this.top = 0; //敵機血量 this.blood = blood; //敵機速度 this.speed = speed; //敵機圖片集合 this.imgs = imgs;//爆炸前和爆炸後 //分數 this.scroe = scroe; } Enemy.prototype = { constructor:Enemy, init:function(){ //創建一個元素 var img = document.createElement(‘img‘); //將圖片路徑賦值給它 img.src=this.imgs[0]; //插入到game中 Engine.game.appendChild(img); //賦值給敵機的初始圖片 this.self = img; //當圖片加載完成以後獲取圖片的高度和寬度 var _this = this;//在函數裏面this的指向會改變,所以我們提前報存下來 img.onload = function(){ _this.left = parseInt(Math.random()*(320-img.offsetWidth)); _this.top = -img.offsetHeight; img.style.left = _this.left+‘px‘; img.style.top = _this.top+‘px‘; }; //生成敵機編號並放入引擎的bullet中 this.id = Math.random(); Engine.enemy[this.id]=this; }, //子彈移動,定時器都交給引擎去做 move:function(){ this.top+=this.speed; this.self.style.top = this.top+‘px‘; //越界判斷 if(this.top>568+this.self.offsetWidth){ this.destroy(); } //判斷與英雄機相撞 if(Engine.isCompact(this.self,Hero.self)){ //自己銷毀 this.destroy(); //英雄機 Hero.die(); } }, bang:function(){ var img = document.createElement(‘img‘); img.src = this.imgs[1]; img.style.left = this.left+‘px‘; img.style.top = this.top+‘px‘; Engine.game.appendChild(img) setTimeout(function(){ img.remove(); },1000) }, destroy:function(){ //銷毀 //從頁面小時 this.self.remove(); this.bang(); //統計得分 Engine.updateScroe(this.scroe); //從內存消失 delete Engine.enemy[this.id]; } }
每架飛機的分數
/* 創建所有類型的飛機 */ function SmallEnemy(){ var s = parseInt(Math.random()*3+3); Enemy.call(this,1,s,[‘image/enemy1.png‘,‘image/enemy1-bang.gif‘],10) } SmallEnemy.prototype = { constructor: SmallEnemy, __proto__: Enemy.prototype }; function MiddleEnemy(){ var s = parseInt(Math.random()*3+2); Enemy.call(this,5,s,[‘image/enemy2.png‘,‘image/enemy2-bang.gif‘],20) } MiddleEnemy.prototype = { constructor:MiddleEnemy, __proto__:Enemy.prototype } function LargeEnemy(){ var s = parseInt(Math.random()*2+1); Enemy.call(this,10,s,[‘image/enemy3.png‘,‘image/enemy3-bang.gif‘],50) } LargeEnemy.prototype = { constructor:LargeEnemy, __proto__:Enemy.prototype }
更新得分
/* 遊戲引擎 */ var Engine = { //剛開始的遊戲狀態 gameStatus:false, //所以敵機 enemy:{}, //子彈 bullet:{}, //得分 scroe:0, //背景圖片 game:document.querySelector(‘.game‘), //頁面得分 textScroe:document.querySelector(‘.score‘), //初始化 init:function(){ this.gameStart(); }, //遊戲開始 gameStart:function(){ var _this = this; //點擊圖片的時候判斷遊戲狀態 this.game.onclick = function(){ if(!_this.gameStatus){ _this.gameStatus = true; //移動移動 _this.bgMove(); _this.handleMove(); _this.createPlane(); } } }, //背景移動 bgMove:function(){ var y=0; var _this = this; this.bgTimer = setInterval(function(){ y+=2; _this.game.style[‘background-position-y‘]=y+‘px‘; },50) }, createPlane:function(){ //創建敵機和英雄機 Hero.init(); //創建敵機 var timer = setInterval(function(){ var num = parseInt(Math.random()*15)+1; switch (num) { case 1: case 3: case 5: case 7: case 9: new SmallEnemy().init(); break; case 2: case 4: case 6: new MiddleEnemy().init(); case 8: case 12: new LargeEnemy().init(); } },500) }, //所有敵機和子彈都要動 handleMove:function(){ var _this=this; var timer = setInterval(function(){ //創建所有子彈 for(var i in _this.bullet){ _this.bullet[i].move() } //c創建所有敵機動 for(var i in _this.enemy){ _this.enemy[i].move() } },30) }, //碰撞檢測 isCompact:function(obj1,obj2){ var l1 = obj1.offsetLeft>obj2.offsetLeft+obj2.offsetWidth; var l2 = obj2.offsetLeft>obj1.offsetLeft+obj1.offsetWidth; var t1 = obj1.offsetTop>obj2.offsetTop+obj2.offsetHeight; var t2 = obj2.offsetTop>obj1.offsetTop+obj1.offsetHeight; if(l1||l2||t1||t2){ return false; }else{ return true; } }, //更新得分 updateScroe:function(scroe){ this.scroe+=scroe; this.textScroe.innerHTML="分數"+this.scroe; } }; Engine.init();
javascript飛機大戰-----008積分