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