av手机免费在线观看,国产女人在线视频,国产xxxx免费,捆绑调教一二三区,97影院最新理论片,色之久久综合,国产精品日韩欧美一区二区三区

JavaScript

JavaScript 小型打飛機(jī)游戲?qū)崿F(xiàn)和原理說明

時(shí)間:2024-09-10 17:05:30 JavaScript 我要投稿
  • 相關(guān)推薦

JavaScript 小型打飛機(jī)游戲?qū)崿F(xiàn)和原理說明

  JavaScript 小型打飛機(jī)游戲?qū)崿F(xiàn)和原理說明

JavaScript 小型打飛機(jī)游戲?qū)崿F(xiàn)和原理說明

  玩法說明:上下左右控制移動(dòng),空格發(fā)彈。 每打中一個(gè)敵機(jī)就加100分,每提升5000分,玩家的飛機(jī)的一次發(fā)彈數(shù)就加一,最多四,被敵機(jī)撞到或者讓敵機(jī)飛到底部就算輸。。。。

  演示代碼:http://demo./js/FlyBeat/

  游戲目前的功能還是比較簡(jiǎn)單的。。。。貌似就貼個(gè)源碼不太好,所以這次還是寫寫思路。。。

  游戲主要分為4個(gè)js文件,4個(gè)js文件分別包含4個(gè)類。

  1:飛機(jī)類---Flyer

  復(fù)制代碼 代碼如下:

  //飛機(jī)對(duì)應(yīng)的dom元素

  this.dom = null;

  //是否活著

  this.isLive = true;

  //是否移動(dòng)中

  this.isMove = false;

  //移動(dòng)的ID

  this.moveId = null;

  //是否發(fā)彈中

  this.isSend = false;

  //目前已經(jīng)發(fā)了多少顆彈(存在屏幕顯示)

  this.nowBullet = 0;

  //游戲背景Dom

  gamePanel : null,

  //游戲背景寬度

  gameWidth : 0,

  //游戲背景高度

  gameHeight : 0,

  //飛機(jī)移動(dòng)速度

  movepx : 10,

  //飛機(jī)移動(dòng)頻率

  movesp : 30,

  //飛機(jī)子彈級(jí)別

  bulletLevel : 1,

  //最大發(fā)彈數(shù)(存在屏幕顯示)

  maxBullet : 12,

  //方向鍵值對(duì)應(yīng)

  keyCodeAndDirection : {

  37 : "left",

  38 : "up",

  39 : "right",

  40 : "down"

  },

  以上是飛機(jī)應(yīng)該有的屬性。。。。

  飛機(jī)除了有固定的一些屬性之外,其實(shí)還應(yīng)該有血量這些的,但這個(gè)是簡(jiǎn)陋版嘛,你可以自己添加。

  更應(yīng)該會(huì)有移動(dòng),發(fā)射子彈,爆炸等方法。

  移動(dòng): 其實(shí)就是捕獲鍵盤事件,如果是簡(jiǎn)單的按下鍵盤的左,然后飛機(jī)就向左移動(dòng)幾個(gè)像素,你會(huì)發(fā)覺,飛機(jī)移動(dòng)起來很生硬,或者說是操作延遲,特別是你想按住鍵盤左的時(shí)候,它移動(dòng)的時(shí)候,延遲得很嚴(yán)重,操作不流暢。所以一般都是:當(dāng)你按下鍵盤時(shí),調(diào)用一個(gè)setInterval函數(shù)來讓飛機(jī)不斷的移動(dòng),當(dāng)釋放鍵盤的時(shí)候,移動(dòng)停止,這樣移動(dòng)就很流暢了。

  發(fā)射子彈: 其實(shí)就是用戶按了空格,然后觸發(fā)一個(gè)鍵盤事件,此事件就是生成一個(gè)子彈Bullet類的對(duì)象,然后讓它飛出去。此類后面會(huì)有說到。

  爆炸: 當(dāng)飛機(jī)撞到敵機(jī)的時(shí)候,飛機(jī)就會(huì)觸發(fā)一個(gè)爆炸事件,結(jié)束游戲。當(dāng)然,這個(gè)檢測(cè)飛機(jī)是否撞到敵機(jī),是在敵機(jī)那里檢測(cè)。

  這些是一些基本事件。還有擴(kuò)展的事件。。可以自己添加

  2:子彈類--Bullet

  復(fù)制代碼 代碼如下:

  //子彈Dom元素

  this.dom = null;

  //子彈移動(dòng)速度

  movepx : 8,

  //子彈移動(dòng)頻率

  movesp : 10,

  子彈最基本的兩個(gè)方法:移動(dòng)與檢測(cè)是否打中敵機(jī)

  移動(dòng):子彈的移動(dòng)簡(jiǎn)單很多,就一直往上跑,top一直減就OK了。

  檢測(cè)是否打中敵機(jī):將敵機(jī)的列表傳進(jìn)方法中,遍歷敵機(jī),檢測(cè)子彈與敵機(jī)是否有碰撞,有則敵機(jī)爆炸,沒有則跳過。

  3:敵機(jī)類--Enemy

  復(fù)制代碼 代碼如下:

  //敵機(jī)dom元素

  this.dom = null;

  //是否

  this.isLive = true;

  //敵機(jī)橫向移動(dòng)速度

  movepx : 6,

  //敵機(jī)縱向移動(dòng)速度

  movepy : 4,

  //敵機(jī)移動(dòng)頻率

  movesp : 75,

  敵機(jī)的基本方法有:移動(dòng),是否撞到飛機(jī)Flyer玩家,爆炸

  移動(dòng):就是敵機(jī)如何移動(dòng),我是設(shè)置成敵機(jī)從上到下飛,讓后從左往又飛,撞到右邊盡頭,調(diào)頭飛。

  是否撞到飛機(jī)Flyer玩家:在敵機(jī)不斷的移動(dòng)過程中,不斷的檢測(cè)飛機(jī)Flyer與敵機(jī)是否有交集,有則兩者爆炸,游戲結(jié)束,否則跳過。

  爆炸:就是敵機(jī)被子彈打中或者撞到飛機(jī)Flyer時(shí)觸發(fā)的事件。

  4:游戲控制類--Game

  其中包含一個(gè)擴(kuò)展方法:從數(shù)組中刪除指定元素

  復(fù)制代碼 代碼如下:

  //擴(kuò)展數(shù)組方法,刪除特定的值

  Array.prototype.remove = function(obj){

  for(var i=0,l=this.length;i < l;i++){

  if(this[i] == obj){

  this.splice(i,1);

  return this;

  }

  }

  throw "The Array has no this Obj";

  }

  其余的,都是些初始化敵機(jī),飛機(jī)以及控制游戲流程的,還有一些修改分?jǐn)?shù),游戲結(jié)束之類的方法。這些沒啥好講。

  大致就這樣,游戲本身比較簡(jiǎn)單,下面的源碼都有注釋,這次寫得比較詳細(xì)。。。有興趣的朋友,可以自己繼續(xù)完善。。。有啥問題,歡迎拍磚。。。多多指教。

  打包下載地址 /jiaoben/32660.html

【JavaScript 小型打飛機(jī)游戲?qū)崿F(xiàn)和原理說明】相關(guān)文章:

色彩搭配原理和技巧09-04

如何調(diào)試javascript腳本呢07-19

javascript跨域訪問的方法07-19

數(shù)碼相機(jī)的曝光原理06-08

母乳的乳汁分泌原理知識(shí)02-08

亞偉速錄機(jī)的原理07-26

顯示器接口D-Sub和DVI的詳細(xì)說明07-16

高爾夫的短桿原理及練習(xí)要點(diǎn)09-05

原理圖設(shè)計(jì)基礎(chǔ)簡(jiǎn)介07-22

滑移裝載機(jī)的工作原理02-01