階段一：玩遊戲的操作步驟1. 點選遊戲開始
2. 蛇出現 食物出現
3. 開始控制蛇頭方向去撞擊食物
4. 碰撞到食物，食物消失，蛇身拉長。如果撞牆，遊戲結束。
5. 繼續下一輪
場景搭建
放乙個容器盛放遊戲場景 div#map，設定樣式
#map
階段二：分析物件
依據遊戲的演示來看，我們應該其實可以得出幾個物件，我們回憶下物件的定義，有屬性，有操作，那我們回憶剛才玩遊戲的步驟，哪些應該是物件
l 遊戲物件
l 蛇物件
l 食物物件
物件分析
每個物件應該具備什麼屬性和方法呢？
食物物件food
屬性水平座標x
垂直座標y
寬度 width
高度 height
顏色 color
方法食物隨機顯示
l render() （渲染、提交）
l 作用: render 隨機建立乙個食物物件，並輸出到map上
蛇物件 snake
屬性蛇節的寬度 width,預設是20
蛇節的高度 height，預設是20
身體 陣列，蛇的頭部和身體，第乙個位置是蛇頭
方向 direction 蛇運動的方向 預設right 可以是 left top bottom
方法render方法
render 把蛇渲染到map上
遊戲物件 game
屬性food 食物
snake 蛇
map 場景
階段三：物件實現
食物物件food
**實現步驟
建立food建構函式
貪吃蛇案例
貪吃蛇大戰 開始暫停 重新整理分數 wrap div1 btn1 btn2 btn3 btn4 建立地圖 var map 01 建立食物 var food 01 建立蛇 var snake 01 var times 0 var speed prompt 請選擇適合自己的速度程度 1,2,3 if s...
貪吃蛇案例
html food.js 食物函式 function window var arr food.prototype.init function map food.prototype.render function map function remove 頭和身體的縱座標是一樣的 把資料放在物件裡，用的...
js物件導向案例 貪吃蛇
食物物件 1 function 沒有則使用預設值 5this.width obj.width 20 6this.height obj.height 20 7this.top obj.top 0 8this.left obj.left 0 9this.backgroundcolor obj.backg...