javascript貪吃蛇完整版(原始碼)_javascript技巧

javascript貪吃蛇完整版 註解完整，物件導向

複製程式碼 程式碼如下:

貪吃蛇Snake v2.4 body{ 9pt; } table{ border-collapse: collapse; border-collapse: collapse; td{ height: 10px; width : 10px; font-size: 0px; } .filled{ 🎜> function $(id){return document.getElementById(id);} /**************************************************** ********** * javascript貪吃蛇v2.4

* v2.4修正了蛇身顏色可以隨著蛇前進而移動 *** ************************************************** *********/ //貪婪 tbl: null, /** * body: 蛇身，陣列放蛇的每一節， * 資料結構{x:x0, y:y0, color:color0}, **/ ,右,下,左, 按鍵盤方向鍵可以改變它 direction: 0, //定時器 speed: 250, //是否已暫停 paused: true, //行數 colCount: 30, //初始化 init : function(){ var colors = ['red','orange','yellow','green','blue','purple』 ("main"); var x = 0; var y //產生初始移動方向 this.direction = Math.floor( Math.random()*4); //建構table var tr=this.tbl.insertRow(-1) ; for(var col=0;col } } //產生20個鬆散節點 for(var i=0; i y = Math.floor(Math.random()*this.rowCount); colorIndex = Math.floor(Math.rand CellFilled(x,y)) { } // 產生蛇頭 x = Math.floor(Math.random()*this.colCount); if(!this.isCellFilled( !this.isCellFilled(!this.isCellFilled(!this.isCellFilled) !this.isCellFilled(!this.isCellFilled(!this.isCellFilled) x,y)){ , body.push({x:x,y: break; } } this.paused = true; // if (!e)e=window.event; | e.which | e.charCode){ 情況 13: { if(Snake.paused){ Snake.move(); Snake.paused = false; } 其他{ // 若無暫停，且停止行動 Snake.paused = true; 休息; } case 37:{//left > } break; } case 38:{//up //快捷鍵在這裡起作用 if(event.ctrlKey){ Snake.speedUp(-20) ; break; > } break; } if(Snake.direction==3){//阻止蛇倒轉 } = 1; break; case 40:{//down Snake.speedUp(20); } if(Snake.direction==0){//阻止蛇倒退走 break; } Snake.direction = 2; break; } } } }, this.timer = setInterval(function(){ Snake.erase(); Snake.paint(); //移動一節身體 moveOneStep: function(){ if(this.checkNextStep()==-1){ clearInterval(this.timer); ); return; } if(this.checkNextStep()==1){ var _x = _point.x; var _y = _point.y; var _color = this.getColor(_x,_y); this.body.unshift({x:_x,y: 食物，所以再產生一個食物 this.generateDood(); //window.status = this.toString(); var point = this.getNextPos(); ; //保留第一節的顏色 var color = this.body[0].color; ngth- 1; i ){ this.body[i].color = this.body[i 1].color; 節， 蛇尾加一節，呈現蛇前進的效果 this.body.pop(); , //window.status = this .toString(); }, //探索下一步將走到何處 pause: function(){ this.paint(); }, getNextPos: function(){ var x = this.body[0].x; var color = this.body[0].color ; //上 if(this.direction==0){ //向右 eldse if(this. ){ x ; else if(this.direction==2){ y ; > else{ x--; return {x:x,y:y}; 的下一步是什麼 checkNextStep: function(){ 🎜> var y = point.y; if (x =this.colCount||y =this.rowCount){ return -1 for( var i=0; i if(this.body[i].x==x&this return -1 ;//碰到自己的身體,遊戲結束 } 🎜> return 1;//有東西 } return 0;/// 空地 }, for(var i=0; i this.eraseDot(this.body[i].x, this.body[i].y); , // 膚色蛇身 Paint: function(){ this.paintDot(this.body[ i].x, this.body[i].y,this.body[i].color); } : function(x ,y) { this.tbl.rows[y].cells[x].style.backgroundColor = ""; tbl .rows[y].cells[x].style.backgroundColor = color; }, //得到一個座標上的顏色 }, //用於調試 for(var i=0; i }:" this.body[i].color " - "; } 一個座標點有沒有填入 isCellFilled: function(x ,y){ if(this.tbl.rows[y].cells[x].style.backgroundColor == ""){ } 回復true ; }, // 重新開始 restart: function(){ } } =0; i this.tbl.deleteRow(0); ]; this.init(); 這個速度= 250; }, // 加速中 🎜> if(this.speed time 2000){ return; this.pause(); this.move (); > } , //產生食物。 generateDood: function(){ var Colors = ['red','orange',' yellow','green','blue','purple','#ccc']; var x = Math.floor(Math.random()*this.colCount); var y = Math.floor(Math.random()*this.rowCount); var colorIndex = Math.floor(Math. random()*7); if(!this.isCellFilled(x,y)){ this.tbl.rows[y].cells[x].style.backgroundColor = Colors[colorIndex]; } } }; /*************************************************** * *********

* JavaScript スネーク v2.4

**************** * ********************************************/&lt ;br /> 点左边按钮または按Enter开始/暂停止游戏

点左边按钮または按Ctrl ↑加速

点左边按钮または按Ctrl ↓减速 $('btn').onclick = function(){ if(Snake.paused){ Snake.move(); Snake.paused = false; } else{ Snake.pause(); Snake.paused = true; } }; $("reset").onclick = function(){ Snake.restart(); this.blur( ); }; $("upSpeed").onclick = function(){ Snake.speedUp(-20); }; $("downSpeed").onclick = function(){ Snake.speedUp(20); };

javascript貪吃蛇完整版(原始碼)_javascript技巧

相關文章