專案演示位址
技術細節
var snake_body // 蛇節陣列，儲存每個蛇節的位置
var direction // 蛇當前移動的方向
var food_position // 食物的位置，每次被蛇吃掉時更新
複製**
function
init_snake() , , ]
// 蛇開始預設向右邊移動
direction = 'right'
// 食物開始位置
food_position =
}// 呼叫蛇的初始化方法
init_snake()
複製**
// init canvas
function
init()
context.stroke()
// 因為遊戲場景中缺省會有乙個食物，這個食物在隨機位置生成
context.fillstyle = 'black'
context.fillrect(food_position.x, food_position.y, 20, 20)
}
複製**
// repaint snake fastival
function
draw_snake() )
}// 判斷是否和食物發生碰撞
eat_food()
// 判斷是否死亡
dead(new_fastival)
}複製**
// left 37
// right 39
// top 38
// bottom 40
window.addeventlistener('keydown', function(e)
} else
if(e.keycode == 39)
} else
if(e.keycode == 38)
} else
if(e.keycode == 40)
}})複製**
function
move_snake() else
if(direction == 'left') else
if(direction == 'top') else
if(direction == 'bottom')
for(var i = 0; i < snake_body.length - 1; i++)
snake_body[snake_body.length - 1].x += x
snake_body[snake_body.length - 1].y += y
}複製**
function
eat_food()
}複製**
// 隨機生產食物位置的方法
function
random_food()
}複製**
function
add_snake_fastival()
// 在全域性陣列中的頭部新增
snake_body.unshift(new_fastival)
}複製**
function
dead(new_fastival)
// 判斷是否自殘
for(var i = 0; i < new_fastival.length; i++) }}
}複製**
貪吃蛇 js版 分享
在學習和總結n多前人的分享後，終於完成了js版 貪吃蛇的小遊戲，邏輯還算清楚 簡單。此版主要是js編寫，稍用了canvas。功能說明 鍵盤方向鍵控制，滑鼠控制，計分制，加速 減速，重置遊戲 簡要分析 1.貪吃蛇本身是乙個 物件陣列 snake array 陣列中的每乙個物件代表了構成貪吃蛇的每乙個小...
js 實現貪吃蛇專案
近來在學習js高階，便學習著做個網頁版貪吃蛇專案。map tools.js function window.tools tools food.js function game.prototype.start function function runsnake if heady 0 heady ma...
js 實現貪吃蛇遊戲效果
用div模擬遊戲畫面範圍，食物，以及貪吃蛇。限定食物出現的時機 為隨機出現。俺不能超出畫面範圍。限定貪吃蛇遊走範圍 限定遊戲規則 1，貪吃蛇，超出畫面範圍遊戲結束。2，貪吃蛇，撞到自己遊戲結束。class map createele px height px background margin 0 ...