JavaScript游戲之是男人就下100層代碼打包
這次的游戲的編寫難度比之前的都高很多。本次鄙人用了js的繼承以及設(shè)計(jì)模式的工廠模式，也算是一個(gè)突破。。。
游戲的大致設(shè)計(jì)思路：
1，玩家類Player：一個(gè)人能左右移動(dòng)，以及上下移動(dòng)的小人。
擁有的基本方法：{
左右移動(dòng) : 單純的鍵盤左右移動(dòng)，
向下移動(dòng) : 屬于向下加速度移動(dòng)，每次移動(dòng)都會(huì)加一個(gè)重力加速度的值，
向上移動(dòng) : 其實(shí)是跟著方塊一起向上移動(dòng)， 勻速向上運(yùn)動(dòng)，
彈跳 : 就是玩家先向上一個(gè)減速度運(yùn)動(dòng)，然后，當(dāng)速度小于1時(shí)，像下加速度運(yùn)動(dòng)
}
2，方塊基類BlockBase：所有方塊的基類，擁有公共的方法以及接口。
擁有的基本方法：{
移動(dòng) : 方塊的向上勻速移動(dòng)，
檢測(cè)玩家是否在方塊上 : 判斷玩家是否停留在方塊上
}
以及一些抽象的接口函數(shù)，只有名字，需要在子類中實(shí)現(xiàn)，具體看源碼。
3，各種子類，如 普通方塊類NormalBlcok、彈跳方塊類FlipBlock等
繼承的實(shí)現(xiàn)方式如下：
在構(gòu)造函數(shù)中：BlockBase.call(this);繼承非prototype的屬性與方法
在函數(shù)外部：子類方塊.prototype = new BlockBase(); 繼承基類的prototype的屬性與方法
4， 工廠類BlockFactory：負(fù)責(zé)生產(chǎn)方塊，以及擊中處理方塊
擁有的基本方法：{
生成方塊 : 重點(diǎn)的方法，就是隨機(jī)生成一塊方塊
}
其實(shí)我也不知道怎么說(shuō)，還是看源碼吧。里面我注釋得很具體了。
還有，bug肯定是會(huì)有的，希望大家諒解。。。
最后獻(xiàn)上預(yù)覽吧。希望大家多多拍磚，能讓我多些提高。最好在代碼的編寫上。
方向左右控制移動(dòng)，界面是做得比較丑。。。大家見(jiàn)諒。
演示代碼：http://demo.jb51.net/js/DownFloor/index.html
完整源碼打包>> /201011/yuanma/DownFloor.rar
相關(guān)文章
javascript 實(shí)現(xiàn)自由落體的方塊效果
這其實(shí)是一個(gè)很簡(jiǎn)單的實(shí)現(xiàn)，create一個(gè)新的div元素，然后append到文檔的body上，經(jīng)過(guò)一定時(shí)間的延遲，做自由落體運(yùn)動(dòng)，著地后fade消失。 不多說(shuō)，直接上代碼。2010-01-01
easyui window refresh 刷新兩次的解決方法(推薦)
下面小編就為大家?guī)?lái)一篇easyui window refresh 刷新兩次的解決方法(推薦)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-05-05
JS運(yùn)動(dòng)相關(guān)知識(shí)點(diǎn)小結(jié)(附彈性運(yùn)動(dòng)示例)
這篇文章主要介紹了JS運(yùn)動(dòng)相關(guān)知識(shí)點(diǎn),總結(jié)分析了JavaScript運(yùn)動(dòng)所涉及的相關(guān)知識(shí)點(diǎn)與注意事項(xiàng),并附帶了一個(gè)JavaScript彈性運(yùn)動(dòng)的實(shí)例供大家參考,需要的朋友可以參考下2016-01-01
深入理解ES6 Promise 擴(kuò)展always方法
本篇文章主要介紹了ES6 Promise 擴(kuò)展always方法，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-09-09
有時(shí)候需要?jiǎng)h除網(wǎng)站的cookies，一個(gè)一個(gè)太麻煩，這個(gè)可以批量的刪除所有的cookies，需要的朋友可以參考下。2010-11-11
JavaScript中this函數(shù)使用實(shí)例解析
這篇文章主要介紹了JavaScript中this函數(shù)使用實(shí)例解析,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-02-02
使用javascript做時(shí)間倒數(shù)讀秒功能的實(shí)例
今天小編就為大家分享一篇關(guān)于使用javascript做時(shí)間倒數(shù)讀秒功能的實(shí)例，小編覺(jué)得內(nèi)容挺不錯(cuò)的，現(xiàn)在分享給大家，具有很好的參考價(jià)值，需要的朋友一起跟隨小編來(lái)看看吧2019-01-01
下面小編就為大家?guī)?lái)一篇Js獲取圖片原始寬高的實(shí)現(xiàn)代碼。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考，一起跟隨小編過(guò)來(lái)看看吧2016-05-05
JS實(shí)現(xiàn)訪問(wèn)DOM對(duì)象指定節(jié)點(diǎn)的方法示例
這篇文章主要介紹了JS實(shí)現(xiàn)訪問(wèn)DOM對(duì)象指定節(jié)點(diǎn)的方法,結(jié)合實(shí)例形式分析了javascript針對(duì)DOM元素節(jié)點(diǎn)屬性相關(guān)操作技巧,需要的朋友可以參考下2018-04-04
大家好，本篇文章分享的是四種好玩的黑客背景效果JS代碼，感興趣的同學(xué)趕緊來(lái)試試吧，覺(jué)得還不錯(cuò)的話記得收藏一下哦，方便下次瀏覽2021-11-11