1.先做食物並隨機生成食物和刪除食物
地圖:寬,高,背景顏色,脫標
食物–div元素
elements---->儲存div的陣列(將來刪除食物div的時候,先從map中刪除div,再從陣列中移除div)
食物:寬,高,背景顏色,橫縱座標
乙個食物就是乙個物件,這個物件有相應的屬性,這個物件需要在地圖上顯示 最終要建立食物的物件, 先 有建構函式,並且把相應的值作為引數傳入到建構函式中
食物要想顯示在地圖上,食物的初始化就是乙個行為
1.食物的建構函式—>建立食物物件
2.食物的顯示的方法–>通過物件呼叫方法,顯示食物,設定相應的樣式
2.1.1 因為食物要被小蛇吃掉,吃掉後應該再次出現食物,原來的食物就刪除了
2.1.2 每一次初始化食物的時候先刪除原來的食物,然後重新的初始化食物
2.1.3 通過乙個私有的函式(外面不能呼叫的函式)刪除地圖上的食物,同時最開始的時候食物也相應的儲存到乙個陣列中,再從這個陣列中把食物刪除
最後的時候,把食物的建構函式給window下的屬性,這樣做,外部就可以直接使用這個食物的建構函式了
2.做出小蛇在地圖中顯示
小蛇就是乙個物件
屬性: 每個身體都有寬,高,方向
屬性:身體分三個部分,每個部分都是乙個物件,每個部分都有橫縱座標,背景顏色
小蛇要想顯示在地圖上,先刪除之前的小蛇,然後再初始化小蛇(小蛇要移動)–方法
//自呼叫函式--小蛇
(function(),//頭
,//身體
//身體
];//方向
this.direction=direction||"right";
}//為原型新增方法--小蛇初始化的方法
snake.prototype.init=function(map)
};//把snake暴露給window,外部可以訪問
window.snake=snake;
}());
//外部測試**
var fd=new food();
fd.init(document.queryselector(".map"));
var snake=new snake();
snake.init(document.queryselector(".map"));
3.讓小蛇動起來
小蛇要移動—方法
思路:把小蛇的頭的座標給小蛇第一部分的身體,第一部分的身體的座標給下乙個部分身體
小蛇的頭,需要單獨的設定:方向
//為原型新增方法--小蛇動起來
snake.prototype.move=function(food,map)
//判斷方向--改變小蛇的頭的座標位置
switch(this.direction)
};//刪除小蛇 的私有的函式
function remove()
}//把snake暴露給window,外部可以訪問
window.snake=snake;
}());
//外部測試**
// var fd=new food();
// fd.init(document.queryselector(".map"));
// var snake=new snake();
// snake.init(document.queryselector(".map"));
// setinterval(function(),150);
4.自呼叫函式,封裝遊戲物件//自呼叫函式--遊戲物件
(function()
game.prototype.init=function(),150);
// this.snake.move(this.food,this.map);
// this.snake.init(this.map);
};window.game=game;
}());
var gm=new game(document.queryselector(".map"));
gm.init();
5.將小蛇動的定時器封裝成遊戲物件的方法並且設定遊戲結束//新增原型方法--設定小蛇可以自動的跑起來
game.prototype.runsanke=function(food,map)
//縱座標
if(heady<0||heady>=maxy)
}.bind(that),150);
};
6.為遊戲物件新增方法,設定使用者的按鍵,改變小蛇的方向
鍵盤按下事件—onkeydown
//新增原型方法--設定使用者按鍵,改變小蛇方向
game.prototype.bindkey=function()
}.bind(that),false);
};
7.結束–讓小蛇動起來的方法中判斷小蛇有沒有吃到食物//判斷有沒有吃到食物
//小蛇的頭的座標和食物的座標一致
var headx=this.body[0].x*this.width;
var heady=this.body[0].y*this.height;
if(headx==food.x&&heady==food.y));
//把食物刪除,重新初始化食物
food.init(map);
python高階第二天
話不多說,上原始碼 class inttuple tuple 重寫父類方法 def new cls,iterable for i in iterable if isinstance i,int and i 0 用列表推導式 f i for i in iterable if isinstance i,...
前端高階第二天
html文件 document 文件的意思 建立乙個html檔案,裡面寫的所有 就會形成乙個html文件。html文件是純文字?答 是 html文件也是純文字,也可以使用記事本開啟,記事本不能解析,只有瀏覽器和能解析html文件。不同的檔案,有不同的字尾 字尾 html 之前也可以是.htm 歷史問...
JS學習第二天
2.3 算術運算子與表示式 常見的算術運算子有 對應在js當中的運算子為 運算的的前提條件是數值才能進行運算,如果不是數值進行加減乘除運算時就會出錯。加法運算 數值 var weight 65 weight weight 10 alert weight 字串拼接 字串 var dogname zha...