贪吃蛇

贪吃蛇应该是接触手机玩的第二款游戏,那时候肯定没有想过有一天我也会码它的代码哈哈哈

思路

一. 找对象

        对象                                   属性                                          方法
1.   游戏引擎          场景 (方格)、 食物 、蛇        游戏开始、游戏结束 
 2.  食物                     大小、颜色                                  出现、改变位置 
3.   蛇      长度、颜色、位置、头、移动方向               吃、移动、长大

二.实现对象

1.HTML文件

 

 
  
  
  
  
  
  贪吃蛇-selfdo
  
 
 
    
    
    
  
 

2.游戏引擎

var gameScene={
    //属性
    rows:30,//行数
    cols:30,//列数
    allArr:[],
    food:null,
    //方法1.开始游戏
    start:function(){
        //游戏初始化
        gameScene.unit();
        this.food=new Food();
    },
    //方法1.初始化
    unit:function(){
        //创建表格(注意:在样式给table设样式)
        var oTable=document.createElement("table");
        for(var i=0;i

3.食物

/*                          属性                         方法
 * food                   大小、颜色                 出现、改变位置 
 */
//构造函数Food
function Food(){
    
    this.x=0;
    this.y=0;
    this.change();
}
//方法1.出现
Food.prototype.display=function(){
    gameScene.allArr[this.y][this.x].className="food";
}
//方法2.改变位置
Food.prototype.change=function(){
    this.x=parseInt(Math.random()*gameScene.cols);
    this.y=parseInt(Math.random()*gameScene.rows);
    //更新位置
    this.display();
}

4.蛇

未完待续···

总结

1.在码程序的过程,我存在一个很大的弊病,经常写完一个js文件,却忘了调用,说到底还是学的不够扎实,在合文件也会出现诸如此类的问题。还是练得少了呀。
2.比如在HTML文件里,
gameScene.allArr[this.y][this.x].className="food";这一句,本意的this是指环境中出现的食物,而在页面上用的this指向的是window,window对象上是找不到那两个属性的,找不到自然就是undefined啦,所以会报下图的错误:


pict1.png

3.平时学似乎觉得也不难,但只有你真正做一个东西的时候才是考验,是不是能把学到的轻松相结合、运用,让它变成你脑袋里的东西。
4.未来的录还长···

你可能感兴趣的:(贪吃蛇)